Docsio
DocumentationGuides
Brand your docs

Fonts and typography

When the auto-extracted font is fine, when to swap it, and the type-system trade-offs that don't fit on a brand-guidelines page.

Choose typography for reading instructions, not just for matching a landing-page headline. A clear body font, consistent heading scale and readable code font give most docs a strong foundation.

What ships by default

Current sites start with readable sans-serif text and a separate code face. URL setup can apply extracted brand fonts. Check what your project actually uses in Settings → General → Brand.

When to override

Use Body Font and Code Font to choose supported font names. If your brand uses a private font, provide a licensed webfont asset and ask the agent to configure it. Typing a name into settings does not upload that font.

Keep a consistent scale

Use the page title once, H2 for main sections and H3 for subsections. Avoid custom font sizes for every paragraph. Leave enough line spacing for multi-step instructions and long code examples.

What about weight?

Reserve stronger weights for headings, labels and a few important terms. A page with every other sentence bold is hard to scan. Keep the number of font files small and check that fallback text is still usable.

Readability test

Read a complete guide on a phone in light and dark mode. Check long lines, tables, inline code and accented characters. If anything feels cramped, adjust the layout or content before adding another font.

Keep exploring

Colors and fonts · Markdown structure
Need a hand? Talk to the Docsio teamClear docs. Happier readers.

On this page