Settings
Custom fonts

Custom fonts

Upload your brand's typefaces and use them anywhere a font is chosen: the workspace Brand styles, a widget's Custom styles, and text in the Canvas editor. Open the list at Settings › Custom fonts.

Available on the Business plan. On Standard the page lists any fonts the workspace already has, but Add fonts and Edit open Custom fonts is a Business feature with the line "Upgrade to the Business plan to upload and manage custom fonts." and an Upgrade button that goes to Plan & Billing.

The Custom fonts page on the Standard plan after pressing Add fonts, showing the Custom fonts is a Business feature dialog with an Upgrade button.

Every Google font is already available in every font picker. You only need this page for typefaces that are not on Google Fonts.

The Custom fonts settings page on the Business plan, listing uploaded font families with an Edit link per row and an Add fonts button in the header.

Prerequisites

You need a .zip file containing your font files. Use one of these formats:

  • .ttf (TrueType Font)
  • .otf (OpenType Font)
  • .woff (Web Open Font Format)
  • .woff2 (Web Open Font Format 2)

The .zip must also include a font.css file that defines the @font-face rules. The CSS should follow this structure, with one rule per weight and style:

@font-face {
  font-family: 'CustomFontName';
  src: url('path/to/font-file.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

The paths in src are relative to the root of the zip. A single wrapper folder inside the zip is fine; the upload flattens it, and macOS metadata folders are ignored.

Add a font

Open the dialog

Press Add fonts. The Add fonts dialog opens.

Choose the zip

Drop the file onto ZIP file with font or pick it. Only .zip is accepted; anything else shows Invalid file type! Please upload a ZIP file.

Check the name

Name is prefilled from the zip's filename. Change it to the exact font-family from your font.css, for example CustomFontName, so the pickers load the right face.

Save

Press Save. A toast reads Successfully saved! and the font is in the list.

Use the font

The new family appears in every font picker in the portal:

  • Font family under Brand styles, to make it the default for new widgets.
  • The Custom styles card on a widget, to use it on that widget only. See Widgets.
  • The text properties in the Canvas editor.

Displays download the font files the next time they load a plan that uses them, so allow a moment after publishing before judging the result.

Edit or remove a font

Press Edit on the row. You can rename the font, or drop a new zip to replace its files, then press Save. Delete at the bottom left removes the font after confirmation; widgets that used it fall back to the brand font.

If your workspace moves from Business to Standard, widgets that use custom fonts keep playing with them. What stops is adding, renaming and replacing fonts. See Plan & Billing.

Next

NotificationsAnalytics