Skip to main content
Bevel → Custom Elements → Custom Fonts installs font families on the site. Each family appears under Custom Fonts at the top of every Elementor typography control, and the files are served from your own server, with no request to Google.

Adding a family

  1. Click New font family and name it (Satoshi, Inter Display, your brand’s face).
  2. Drop the files into the family. One file per weight and style: Satoshi-Bold.woff2, Satoshi-BoldItalic.woff2, and so on.
  3. Choose a fallback (sans-serif, serif, monospace, cursive, system UI) and check the live preview.
Accepted formats: WOFF2, WOFF, TTF, OTF. Files are checked by their contents, not their names: a renamed file, or one that is not really a font, is refused. The weight and style are read from the file name (Bold, 700, SemiBold, Italic and the rest) and can be corrected per face afterwards.

Using it

Pick the family in any typography control, in Site Settings global fonts, or by name through Bevel MCP, which lists the installed families and the weights that ship with them. Files live under wp-content/uploads/bevel/fonts/. An assistant connected through Bevel MCP can install fonts too, from a link or through an upload page you drop the files onto; the family lands here. See Uploads.

Google fonts

Elementor’s Google Fonts list is frozen at a release; the Kit back-fills families Google published since, so a newer family is available by name. The Google Fonts Load and Load Google Fonts Locally settings under Tools → Optimization control how Google fonts are served.

Preloading

Site Settings → Settings → Preload Fonts lists the site’s custom fonts and the Google fonts stored locally, and preloads the ones you tick. Pick only the families used above the fold. See Extras.