New in the Apps SDK: line height, letter spacing, and a bigger max font size

Announcements
,
1

Hey devs :waving_hand:

Two updates to text formatting in the Apps SDK that a few of you have been asking for (especially if you’re building anything that imports text).

Line height and letter spacing

You can now set line height and letter spacing when formatting paragraphs with createRichtextRange. Both new properties sit on RichtextFormatting, alongside fontSize, textAlign, and the rest:

import { createRichtextRange } from "@canva/design";

const range = createRichtextRange();
const bounds = range.appendText("Some imported text");

range.formatParagraph(bounds.bounds, {
  lineHeightEm: 1.4,      // 0.5–2.5, relative to font size
  letterSpacingEm: 0.02,  // -0.2–0.8, relative to font size
});

Both values are expressed in Em, relative to the font size, so they’ll scale naturally with the text. This means imported designs can now carry line height and letter spacing across instead of losing that styling on import.

Max font size is going up

We’re also raising the max font size you can set through the SDK, from 100 up to 1000. If you’ve been clamping font sizes on your end to work around the old limit, you’ll be able to remove that workaround.

Where to find it

As always, these are beta APIs, so they may still change before GA. Let us know how it goes, and flag anything that doesn’t look right below :backhand_index_pointing_down:

We’re hoping to take these to GA over the next week or so — stay tuned.

6 Likes