How to Set Website Fonts

To customize fonts, open Site Settings → Fonts and Colors. You can also change the font settings for headers and body text (saturation, size, color) that will apply to all blocks on all pages of the website.
To customize fonts for the entire website, go to Site Settings → Fonts and Colors.

You will see a font library with pre-installed free typefaces. You can navigate through it and assign a font to the website by clicking the "Select" button. The font will be assigned to the website heading and body text. The collection contains over 20 standard and premium fonts from our partners (type.today and Paratype), which are available for free with active Tilda subscription.


If you want to use a third-party font or use different fonts for header and text, click the "Custom Settings" button.

You can choose different fonts for the Heading Font Family Name and the Body Text Font Family Name in the Basic Fonts tab.
The Google Fonts, Adobe Fonts, and Your Own Font tabs allow you to use a font from an external source. See the detailed guides below to read more about these options.
Free Google font collection
Using .WOFF or .WOFF2 fonts
Adobe's large library
Setting fonts for headings and body text of the website
The "Fonts and Colors" tab contains the default size, weight, and color settings for website titles and body text. These settings apply by default to all blocks on the website (except Zero Blocks), unless other font options are configured within the blocks.
You can specify the font parameters in the Settings panel of the block → Typography or select the text in the editor - by clicking on it - and change its parameters using the toolbar on top.
Font loading settings
By default, the text on a website is displayed after the font file is loaded, this may happen with a certain delay depending on the speed of the Internet connection.

You can set the system fallback font to show while the website is loading in Site Settings → Fonts and Colors → Advanced. This will display the text immediately, but first in the backup font and then in the font of your choice. This can cause brief flickering of text and resize of text elements, so use this setting only if you're confident that it will make your website look better when it loads.
Made on
Tilda