Docs
Font Pairs

Font Pairs

Profile image
Miro Kosut
Jan 24, 2024 • 1 min read

The Bento theme includes the following predefined Google Font pairs for the heading and body of your site:

  • Dosis-Nunito
  • Oswald-Lora
  • Inter-Inter

To select your preferred font pair, please go to Site → Design & branding → Side wide and look for the dropdown menu labeled "Font pair".

The default Google Font pair is "Dosis-Nunito".

Custom Fonts

Alternatively, you can inject completely custom Google Fonts (or similar).

To inject custom fonts, please go to Site → Design & branding → Site wide and look for the dropdown menu labeled "Font pair". Choose "none" to prevent any Google Font pair from loading and overriding your custom fonts. Then inject the code to load custom fonts in Site → Advanced → Code Injection.

Make sure you apply the font family to the body and all headings:

<style>
  body {
    font-family: "your-default-font" !important;
  }

  h1,h2,h3,h4,h5,h6, {
    font-family: "your-display-font" !important;
  }
</style>

Ghost Custom Fonts

Alternatively, you can use Ghost custom fonts. In that case, set the Font Pair to "custom" in the custom settings.