Studio.Design offers a wide variety of fonts at no extra charge on all plans. This article walks you through how to apply a font to a text box, and how to replace or remove fonts you've already set up.
For details on managing the fonts used within your site, see Font List: Managing the fonts used in your site.
ℹ️About replacing fonts due to the end of FONTPLUS support
The "FONTPLUS" fonts offered in Studio.Design will no longer be available after April 7, 2026, due to the end of our contract with Monotype, the service provider.
For more details and instructions on how to replace these fonts, please refer to the dedicated help page below.
Adding a font to your Font List
To apply a font to text, you'll first need to add it to your Font List.
Fonts added to the Font List act as a "Font Family." You can add subfonts that support the base typeface (font), or assign a label to help organize fonts within your site.
Applying a font to a text box
Fonts are set per text box. You can also specify different fonts for each breakpoint so the display changes between desktop and mobile.
Tip: Default font
Newly added text boxes automatically use the default font set in your Font List.
If no default font is set, "Lato" is used as the initial default.
In the right panel, open the [Text] tab. If the panel is closed, open the right panel first.
Under [Typography], click the [Font] input field.
From the [Font Family] list, either pick a font family you've already added, or click [Add Font] to add and apply a new font family.
Adding a new font family
Here's how to add a new font family.
Click [Add Font] at the bottom of the font family list.
A list appears showing the font groups available in Studio.Design (Google Fonts, TypeSquare, and other web fonts, system fonts, and custom fonts), along with the fonts in each group.
When you click a font, it's instantly added to your Font List and applied to the text box.
To apply your changes to your live site, you'll need to update your site.
Setting up a subfont
For fonts added to your Font List, you can set up subfonts to use as backup. With subfonts, you can specify fonts by language, or specify which fonts appear on each device when using system fonts.
For details, see Managing fonts used in your site > What is a subfont?
In the right panel, open the [Text] tab. If the panel is closed, open the right panel first.
Under [Typography], click the [Font] input field.
In the [Font Family] list, click the icon
next to the name of the font you want to add a subfont to.
Click the [Add Subfont] button.
A list appears showing the font groups available in Studio.Design (Google Fonts, TypeSquare, and other web fonts, system fonts, and custom fonts), along with the fonts in each group. Pick the font you want to register as a subfont.
Changing (replacing) a font
You can swap out a font family's base typeface (font) or subfont for a different one. When you make this change, the font is replaced everywhere the font family is used.
In the right panel, open the [Text] tab. If the panel is closed, open the right panel first.
Under [Typography], click the [Font] input field.
Click the icon
next to the font family's label name.
In the [Font] input field, click the arrow icon [Replace Font] next to the base typeface (font) name.
Pick a font from the list to replace it.
Click [Usage] at the bottom of the font settings panel to confirm that the replacement was applied correctly.
To apply your changes to your live site, you'll need to update your site.
Deleting a font family
In the right panel, open the [Text] tab. If the panel is closed, open the right panel first.
Under [Typography], click the [Font] input field.
Click the icon
next to the font name.Click the three-dot menu in the upper right of the [Font Settings] panel.
If the font is being used on any pages, [Replace and Delete Font] will appear, and a modal will open.
Pick the font family to replace it with, then click the [Delete Font] button.
