Font Family

Choose between font name, font resources, and Google fonts.

Custom Fonts

Elements includes a built-in Font Manager that lets you add your own local web fonts. It supports common formats like .woff, .woff2, and .ttf, making it easy to use custom typography in your designs.

For best browser support and performance, custom fonts should be provided in WOFF2 format. WOFF (the Web Open Font Format) is a web font format developed by Mozilla, Type Supply, LettError, and other organizations.

Recommended formats (in order of preference):

1. WOFF2 – Most modern and efficient format (used by all modern browsers).

2. WOFF - Good option when also supporting older browsers.

3. TTF - Mostly for legacy or specific use cases (not recommended for production due to larger size and weaker compression).

Adding Custom Fonts

Add your font files to the resources area in Elements, use the media inspector to define a weight (and width if required) for each of the font files.

Add a new Custom Font in the Theme Studio, give it a name, and set the Kind to "Font Resources"

Next, drag each font file individually from the resources area of your website into the theme studio window.