Fonts & Typography
The fonts you choose set the whole personality of your website. A clean, modern typeface says something different from an elegant serif, and getting this right makes your site instantly feel more professional. Best of all, you pick your fonts once and they apply everywhere: every heading, every paragraph, every button label across your site follows your choices automatically.
You'll find these controls in Site Settings → Branding → Typography. Branding and Site Settings are available to Site Admins; Site Editors won't see them. As you make changes, the live preview updates so you can read your actual fonts before saving.
Heading font and body font
You choose two fonts:
- Heading font: used for your titles, section headings, and other large, attention-grabbing text. This is where personality shows most.
- Body font: used for your regular paragraphs and most of your everyday text. This one's job is to be comfortable to read for long stretches.
Each font is picked from visual preview cards: you see a real sample of each typeface, so you're choosing by how it looks, not by name alone. The available fonts are:
| Font | Character |
|---|---|
| Inter | Clean, neutral, highly legible: a safe modern default |
| Geist | Minimal and precise, with a quiet tech feel |
| Manrope | Rounded and friendly, with a confident presence |
| DM Sans | Warm, approachable, professional (an all-purpose favorite) |
| Plus Jakarta Sans | Contemporary and stylish, slightly distinctive |
| Space Grotesk | Geometric and characterful, with a bit of edge |
| Playfair Display (serif) | Elegant, high-contrast serif, refined and editorial |
| Crimson Pro (serif) | Classic book-style serif: great for readable long-form text |
| Roboto | Familiar, dependable, works everywhere |
To set your fonts:
- Go to Site Settings → Branding → Typography.
- Under Heading font, click the preview card for the typeface you want.
- Do the same under Body font.
- Check the live preview to see the two working together.
- Save.
Using a custom font
If your brand uses a specific font that isn't in the list, choose Custom. This lets you bring in a font from Google Fonts. Two pieces are required, and both must be filled in for a custom font to work:
- A Google Fonts embed link: the web address Google Fonts gives you for including a font on a website.
- The matching font-family name: the exact name of the font as Google Fonts lists it, so your site knows which font to actually apply.
If you only provide one of the two, the custom font won't display correctly, so make sure you copy both from the Google Fonts page. You can use Custom for your heading font, your body font, or both.
Font weight
Weight is how thick or thin the letters appear. You control this separately for headings and body:
- Heading weight: ranges from Light through to Extra Bold. Heavier weights feel bold and assertive; lighter weights feel refined and airy. Pick the weight that matches the tone you want for your titles.
- Body weight: choose Regular or Medium. Regular is the standard, most comfortable choice for paragraphs; Medium adds a touch more presence if you want your body text to feel a little sturdier.
Advanced typography (optional)
Below the main choices is an Advanced section, collapsed by default. Most businesses never need it. The defaults are already balanced. Expand it only if you want to fine-tune the fine details of how your text is spaced.
- Heading letter-spacing (tracking): how tightly or loosely the letters in your headings sit together. Options: Tight, Tighter, Normal, and Wide. Tighter spacing can make large headings feel more polished; wider spacing gives an airier, more spread-out look.
- Heading line height: the vertical spacing between lines in a multi-line heading. Options: Tight, Snug, and Normal. Tighter line height keeps big headings compact.
- Body line height: the vertical spacing between lines in your paragraphs. Options: Snug, Normal, Relaxed, and Loose. More line height (Relaxed or Loose) can make long paragraphs easier and more comfortable to read.
Tips
- Pair a distinctive heading with a simple, readable body. The classic recipe for a professional site is a heading font with some personality (say, Space Grotesk, Manrope, or Playfair Display) matched with a clean, unfussy body font (like Inter, DM Sans, or Roboto). Let the headings have the character; let the body just be easy to read.
- Don't over-style body text. Body text is read in bulk, so keep it Regular or Medium weight with comfortable line height. Save the drama for your headings.
- Serif for elegance, sans-serif for modern. The two serif options (Playfair Display, Crimson Pro) lean classic and refined; the rest lean clean and contemporary. Choose based on the feeling you want customers to have.
- Read the preview, not just the name. The preview cards exist so you can judge fonts on how they actually look with your words. Trust your eyes.
Good to know
- Your font choices apply site-wide and update everything at once. You don't set fonts page by page.
- Applying a theme preset is a quick way to get a coordinated font pairing (each preset picks a font for you), and you can still change the fonts afterward.
- Related reading: Choosing Your Colors and Shape, Effects & Button Styles.