Text

T draws a text layer. Click for a label that grows with what you type, or drag a box for text that wraps inside it.

1. 1.Double-click the text and type0:00
2. 2.Its type settings are in the Design panel0:03

Description

A launch post with its headline. The headline is double-clicked and its words retyped, then Escape leaves the text layer selected. The Design panel’s Text section shows its text style, font, size and spacing.

1. Double-click the text and type (⌘A selects what is there).
2. Press Esc: the text layer stays selected.
3. Its text style, font, size and spacing are in the Design panel's Text section.

Type settings

Family, size, weight and style, letter spacing, and line height — a number, or Auto to let the font decide. Alignment is left, centre, right or justified, vertically top, middle or bottom.

Text case (original, UPPER, lower, Title) and decoration (underline, strikethrough) are applied rather than typed, so the underlying text stays editable.

Lists are here too — bulleted and numbered, with nesting.

Fonts

The font picker holds every Google Font, about 1,900 families, from Roboto Condensed and Oswald to EB Garamond and Libre Baskerville. Search by name, or narrow the list to sans serif, serif, display, handwriting or monospace. Each row previews in its own face as it scrolls into view.

Nothing is downloaded until you use it. Picking a family fetches just the weight and style your text needs, and keeps it in the browser so it works offline after that. A file set in a family you haven't used yet loads it when it opens. If a font can't be fetched (you're offline, say), the text draws in a stand-in face until it can, and the Preflight panel lists it.

Google Fonts are released under the SIL Open Font License or the Apache License, so they can be embedded in the PDFs, web pages and other files you export, and used commercially.

The agent can search the same catalogue (search_fonts) and set any family it finds.

Your own fonts

To use a font that isn't on Google Fonts, choose Upload Font… at the bottom of the picker and pick a .ttf, .otf, .ttc, .woff or .woff2. The font goes into the file: every copy of it, on every device, and every export draws its text in that font. Add a file per weight and style (a Regular, a Bold, an Italic) and each text uses the nearest one. A collection (.ttc) holds several faces in one file; the palette's Add font to file… and the command line let you choose which one (by number or by name).

Exports keep the font:

• PNG, JPG, video and GIF draw it, as the canvas does.
• PDF embeds just the letters the file uses (a subset), so the PDF prints and searches with your font.
• SVG draws its letters as outlines. The SVG looks the same in every viewer without the font installed, and the font file itself is not handed on with the SVG.
• Web code ships the font file with the page and names it with @font-face: inside the HTML, or beside it in the zip in a fonts/ folder.

Team fonts. When you're signed in, Upload Font to Team… uploads a font once for your whole team, and every file of the team can use it. Team fonts count toward your team's storage, like pictures and video.

Only upload fonts you're allowed to use this way. A font's licence says whether it can be embedded in PDFs and web pages and shared with your team.

Missing fonts

A text set in a family that nothing can draw (not in the file, not your team's, not on Google Fonts) shows its family name in the picker with a warning sign, and the Preflight panel lists it. The text still draws, in a stand-in face, and exports of it say which fonts were missing. Upload the font to fix it.

Variable fonts expose their axes as sliders, so weight and width are continuous rather than a short list of named cuts.

OpenType features

Small caps, oldstyle and tabular figures, ligatures, alternates and stylistic sets are toggles in the type details flyout, on the text you have selected rather than the whole layer.

A font only offers what it was built with, and some webfont subsets ship without their stylistic sets. If a toggle does nothing, the feature isn't in the file you loaded.

Text on a path

Select a text and a path (a vector you drew, or any shape: a rectangle, ellipse, polygon, star, line or frame), right-click, and choose Attach text to path. The type runs along the outline and stays linked to it: move or reshape the path, edit its points, and the text follows. Around a closed shape it starts centred over the top.

You don't need a second layer for the common shapes. Text path in the inspector also bends the text on its own:

• Arc — a bend from a gentle curve to a full circle, up or down.
• Circle — round a circle of any radius, for badges and stamps.
• Wave — along a wave, with its height and how many waves it makes.

Everything else is the same whichever path the text is on:

• Alignment between the brackets: left, centre, right, or stretch to fill them exactly.
• Start and End brackets, and Flip to run the text the other way, on the other side of the path (inside a closed shape). On the canvas the selected text shows the three brackets: drag the start or the end one along the path, or drag the middle one to slide the text, and across the path to flip it.
• On path: whether the baseline, the ascender, the descender or the middle of the letters rides the line, plus a shift off the path and extra spacing between letters.
• Effect, as in Illustrator's Type on a Path options: Rainbow turns each letter to the path, Skew keeps their verticals vertical, 3D ribbon keeps their horizontals horizontal, Stair step keeps them upright on the path, and Gravity points them at the path's centre.
• Overflow: text past the end bracket is hidden with a red + marker (Clip), drawn on anyway (Show), or the type shrinks until it fits (Shrink).

The selection box, clicking and snapping follow the letters where they actually sit, and double-click edits the text in place with the caret on the path. Styled runs, variable fonts, text animators and brand text styles all work on a path. Detach text in the menu straightens it again.

SVG export writes a live <textPath> wherever SVG can say the same thing (one line of one style, turned to the path), and the exact outlines the canvas draws otherwise; PDF and the other exports use those outlines too.

Fit text to shape

Select a text and a closed shape, right-click, and choose Flow text into shape (area type). The text wraps inside the outline — each line as wide as the shape is at that height, so it fills a circle, a star or any closed vector — and the text's vertical alignment places the block inside it. Inset keeps it off the edge. It stays linked: resize or reshape the shape and the text reflows. When there's more text than fits, the rest is hidden and a red + shows at the corner.

Fit & flow in the inspector has the same controls, plus Auto-size, which chooses the font size for you:

• Shrink makes the type smaller only when it overflows.
• Fit picks the size that fills the container exactly — the shape, the text's own fixed box (Fit text to box), or the path between its brackets.

Auto-size scales every size in the text together (runs, spacing and line height included), and your own font size stays as you set it, so turning it off puts it back.

Outlined text

Click + by Stroke on a text layer and it gets an outline straight away: Outside the letters, round corners, about a twelfth of the font size wide. Change the width, colour, alignment and join like any stroke.

Behind fill (on by default for text) paints the outline behind the letters, as SVG's paint-order: stroke and Illustrator's stroke-behind-fill do. A thick outline on small or condensed type then never covers the neighbouring letters, so sticker-style labels stay readable without a duplicate layer underneath. Turn it off to paint a centred stroke over the letters instead. An Outside stroke never covers the letters either way; an Inside stroke only shows over the fill.

Outlines work at any width and zoom, and they come out the same in PNG, SVG (paint-order), PDF and web exports (-webkit-text-stroke with paint-order).

Text effects

Presets that do the fiddly work in one click: Shadow, Lift, Neon, Glow, Outline, Hollow (outlined letters with no fill), Echo (three trailing copies), Background (a soft block behind the words) and Curve. Pick one in Text effects, then tune it there: Distance, Direction, Blur, Thickness, Strength and colour, whichever the preset uses. Sizes are a share of the font size, so the effect grows and shrinks with the text: change the size and the shadow or outline follows. The presets are also in the command palette (Text outline, Text shadow, Hollow text…) and in set_text_effect for the agent.

Because text is drawn on the GPU like everything else, it also takes fills, strokes, blend modes and effects directly — a gradient-filled, halftoned headline is still live text you can retype.

Text styles

Save a set of type settings as a text style and reuse it. Change the style and every layer using it follows. Styles can also be published in a library so a whole team shares one scale.