Fonts not loading

If you've picked a font in Theme settings → Typography but the rendered page shows a system fallback (Helvetica / Times), check these:

1. The font is from Shopify's library

Theme picker only loads Shopify-hosted fonts. Custom uploaded fonts (Settings → Files → upload your .woff2) require additional Custom CSS to declare and use:

@font-face {
  font-family: 'YourFont';
  src: url('https://cdn.shopify.com/.../yourfont.woff2') format('woff2');
  font-display: optional;
}
:root {
  --font-heading-family: 'YourFont', serif;
}

2. font-display is optional

For headings and body, Dost uses font-display: optional. On slow networks, the font might not load before the page paint deadline — the system fallback is used and the custom font is cached for next visit.

This is intentional (zero CLS) but means first-visit users may see fallbacks.

3. CDN cache

Brand new font choices take ~30 seconds for Shopify's CDN to make available. Refresh after waiting.

4. Style / weight not available

If you've picked an italic or bold variant that doesn't exist in the chosen font, the browser falls back to the closest available weight. Pick a different font with a complete family.

Test

Use DevTools → Network → filter font to see what fonts load and from where. If your chosen font isn't in the list, the picker config didn't save — re-save in Theme settings.