How to use subscripts, superscripts and special characters in Sketch.

Need to include footnotes, trademarks, emoticons or glyphs? Sketch has two ways to do it, but they are tricky to find.

Have you struggled to figure out how to add trademarks, superscripts and other special characters in Sketch? On the Verizon Design Team, we work with legal documentation all the time and were looking for a better way of drawing footnotes, registration marks and trademarks. We didn’t have a good solution until we found Brandt Day’s post on special characters. It led us down the right path and we wanted to share it with the internet…you’re welcome.

A little GIF of where to find Subscript

Method 1: Baseline

(We lovingly named this “The Statlender Method” after Ori Statlender who works on The Verizon Design team with me.)

1. Type the text you want to be superscripted or subscripted. Highlight the text with your cursor.
2. Select the Text menu item from the global navigation bar at the very top of your screen.
3. Select Baseline from the Text menu.
4. Select Superscript or Subscript from the Baseline submenu.
5. The distance from the baseline is very generous (probably too much) by default. To adjust go back into the same menu and select Raise of Lower. You’ll have to do this repeatedly to make a big difference. Select Default to go back to the default settings.

Side note: The Text menu is also where you can find other text manipulation tools like kerning and ligature and change case (Transformation).

Method 2: Vertical Position

(We named this “The Bora Method” because I wrote this and I am shorter than Ori.)

1. Type the text you want to be superscripted or subscripted. Highlight the text with your cursor.
2. Select View from the global navigation bar at the very top of your screen.
3. Select Show Fonts from the View menu.
4. The Font tool palette should appear. Select the Gear dropdown.
5. Select Typography from the Gear dropdown.
6. The Typography menu should appear. Select Vertical Position from the turndown menu.
7. This method only works with fonts that have these characters defined in the typeset. It worked with our proprietary font Verizon Neue Haus Grotesk and Avenir. We also tried with Helvetica, Helvetica Neue, Arial, Baskerville, Georgia, Futura, and Lucida Grand.
8. From there, select Subscript or Superscript option. Make sure your text is selected when you do all of these steps. Just like other inspect approaches it can be easy to accidentally deselect the thing you are trying to modify while you are clicking around in all the pop-up tool palettes and menus.

For our typeface, Verizon Neue Haas Grotesk, we prefer the The Bora Method because it gave us the distance from the baseline we wanted and luckily our typeface could support it. If you are using a common system font, you may have to use The Statlender Method and adjust the distance manually.

Characters and Marks

Look at some of the other options in the Typography menu. This may be a better way of adjusting your text. If you select Character from the Gears dropdown in the Font tool you can select unicode glyphs and emoticons.

The Characters tool in Sketch

Hot Keys for Marks

Trademark
Option+2 ™

Registration
Option+R ®

Copyright
Option+G ©

We hope you find this helpful. Please comment and share any other tricks you have for working with special characters or type variances.