Fonts and images

Each project has a library of the fonts and images its paywalls use. The library belongs to one project; your team's other projects can't see or use it.

Limits

WOFF and WOFF2 web fonts, SVG and Lottie files aren't accepted. Images are kept exactly as uploaded, so compress them first.

Use your own font

Paywall text uses Inter (default) until you choose another font.

1. Select a text layer and open the Font menu in Typography.
2. Choose Upload font… and select a TTF or OTF file.
3. Choose the uploaded font, listed by family and style, such as Roboto Bold Italic.

Each file is one style. To use bold and italic text, upload the bold and italic files too.

Fonts are packed into each build, so apps download them with the paywall. The build warns when a font is larger than 500 KB, since it slows the first download. Characters a font lacks are drawn in a fallback font, so pick a font that covers your languages.

Add images

1. Select a layer and set its Fill to an image. The library opens as Choose an image.
2. Click Upload to add one or more images.
3. Pick the image.

Each image's menu has Rename, Copy URL and Delete.

Remove assets safely

• Images load when the paywall shows. Deleting an image breaks it in paywalls that are already live, so replace it in those paywalls and deploy them first.
• Fonts can't be deleted in Studio. They're copied into each build, so a font that leaves the library doesn't change live paywalls. In the designer, text that used it shows Missing font and draws in Inter, and so do later builds.

If something's off

• Upload fails: the file is a web font (WOFF, WOFF2), SVG or Lottie, or over the size limit. See Limits.
• Text shows Missing font: the font isn't in this project's library. Upload it again or pick another.
• An image is broken in a live paywall: it was deleted from the library. Upload it again, set it in the paywall, and deploy.

Next steps

• Design a paywall
• Translate a paywall
• Build and deploy