Adding text
Adding text
To insert text, select Insert > Text in the Toolbar or Menu Bar. Alternatively, press T, then click anywhere on your Canvas and start typing.
You can also click, then drag to create a fixed size text box where text will wrap to a new line instead of expanding the size of the text box.
Adding rich text
To insert rich text (with styling from another app), select Edit > Paste > Paste as Rich Text or press ⇧⌥⌘V.
Adding text to a vector path
To add text to a vector path, you’ll need both a text layer and a shape layer below it in the Layer List. Select the text layer and then select Text > Text on Path . Finally, drag your text layer towards your shape layer and let it snap into place.
To remove text from the path, select Text > Text on Path again.
Formatting text
You’ll find many ways to change how your text looks in the Inspector, along with a few more advanced options in the Text menu in the Menu Bar.
Formatting text
Sketch measures all layers (including text) using the macOS coordinate system’s points, where one point equals one pixel on the Canvas by default. Learn more.
Formatting text in the Inspector
Select a text layer on your Canvas to see most formatting options and properties in the Inspector.
- Under the Appearance panel you can save and apply Text Styles to keep the appearance of different text layers consistent across your designs.
- Use the Text to select your text layer’s typeface (font), weight, font size and color.
- If you’re using an OpenType font with variable options (weight, width, slant, optical size, etc.), click on to open the Variable Font Options popover and drag on the sliders to adjust their values.
- Use the Character, Line and Paragraph controls to adjust spacing.
- Use the Auto Width, Auto Height and Fixed Size controls to change how a text box resizes to fit its contents.
Note: The Mac app measures all layers (including Text) using the macOS coordinate system’s points — where one point equals one pixel on the Canvas. Read more about measurements in the Mac app.
- Auto Width widens the text box as far as possible to fit your text on a single horizontal line.
- Auto Height wraps text to a new line to fit the text box’s width, and and resizes its height to fit all text.
- Fixed Size gives you control of the height and width of your text. Text will wrap to fit inside the box itself and crop when it exceeds its height. You can align this setting both horizontally and vertically.
- Use the Alignment panel to set horizontal and vertical text alignment.
- Open the Text Options panel and click on at the top of the Text panel to set:
Text decoration options for special formatting like underline or strikethrough Text transformation options such as uppercase and lowercase . Text transformation options are non-destructive, so you can switch between these options without losing your original formatting.
If the font you’ve selected supports OpenType features you’ll find them at the bottom of the Text menu. If the font has variable options, you’ll find these in the Inspector.
Formatting text using the Text menu
Open the Text menu in the Menu Bar to find additional text formatting options, including:
- Bold, Italics and Underline
- Bigger or Smaller text
- Lists, including unordered and ordered lists
- Transformations, including uppercase and lowercase
- Kern, Ligature and Baseline options.
Editing multiple text layers
To edit more than one text layer at the same time, hold ⇧ and select every text layer that you want to edit — either on the Canvas, or from the Layer List. Use the Text menu in the Inspector to change the styling of your text, then click anywhere on the Canvas to apply your changes.
Customizing lists
To create a list, select a text layer with line items separated by returns, then go to Text > List Type and choose either Numbered or Bullet.
You can customize your list’s appearance, starting number (for numbered lists), prefixes, suffixes, and bullet or number type by highlighting your list and choosing Text > List Type > List Options.
OpenType features
If you’re using a font that supports OpenType features, select your text and choose Text > OpenType Features from the Menu Bar, then select and enable the OpenType features you want to use.
Changing text color
You can apply different colors to different parts of your text using the Color Picker in the Inspector’s Text panel.
Alternatively, you can apply a fill from the Fills panel in the Inspector — as well as apply different types of gradients. Keep in mind that fills will override any text color you’ve previously set with the Color Picker.
Adjusting line height
When you create a new text layer, its line height will automatically adjust to match its font size.
If you manually adjust the line height, typeface or font size of a text layer, the text will reposition itself so that the first baseline will always stay in place. Similarly, if you change the typeface or font weight in a paragraph, the line height will stay consistent.
To revert to the text’s default line height, simply delete the custom value in the Line field in the Inspector and press ⏎ on your keyboard.
Converting text to vector shapes
Converting text to vector shapes
To convert text into vector shapes and edit them like other vector layers, select a text layer and choose Layer > Convert to Outlines from the Menu Bar. Alternatively, press ⌥⌘O.
Converting text to outlines is a destructive process — you won’t be able to edit the text itself again. Also, keep in mind that converting lots of text to outlines can slow down Sketch.
If you apply a Boolean operation to a text layer, it will have the same effect as converting it to outlines, except you can still edit the text.