Typography

The brand runs on three type families. Each one has a job; together they cover everything from a 12px tooltip to a 72px hero headline.

This page is the brand-side view — what each typeface is for, how it feels, and what to reach for in which situation. For the developer-facing token reference (sizes, weights, line heights), see Typography.

Inclusive Sans — interface and body

A geometric humanist sans designed by Olivia King for maximum legibility at small sizes. Open apertures, generous spacing, neutral personality. It does not call attention to itself, which is exactly why it works for body copy and UI: the eye reads through it, not at it.

Use Inclusive Sans for body text, navigation, buttons, form fields, captions, and anything else that needs to be read quickly without friction.

Loaded from: Google Fonts CDN — fonts.googleapis.com.
Licence: SIL Open Font Licence 1.1 (free to use, embed, and self-host).
Weights in use: 300, 400, 500, 600, 700.

RecifeText — headlines and editorial

A contemporary text serif from DSType, drawn by Dino dos Santos. Tall x-height, low contrast, slightly informal. It carries weight without feeling stuffy — the right register for editorial headlines, big statements, and the kind of brand moments where the type itself should be doing some of the lifting.

Use RecifeText for headings (h1–h6), pull quotes, hero statements, and anywhere a headline needs to feel like a headline rather than just larger body text.

Loaded from: self-hosted in assets/fonts/recife-text/.
Licence: Commercial — DSType desktop + web licence. Self-host for By Default properties only; do not redistribute or serve from a public CDN.
Weights in use: 400 (regular).

IBM Plex Mono — code and labels

IBM's open monospace from the Plex superfamily. Rounded, even, and unmistakably technical. Use it for code blocks, inline code, keyboard shortcuts, file paths, and any small label that needs to read as "machine output" rather than running prose.

Loaded from: Google Fonts CDN — fonts.googleapis.com.
Licence: SIL Open Font Licence 1.1.
Weights in use: 400, 500, 600.

When to reach for which

Pairing rules

Do

• Use RecifeText for the headline and Inclusive Sans for everything underneath. That's the default rhythm.
• Lean on weight, not colour, to create hierarchy inside Inclusive Sans body copy.
• Use Plex Mono for anything that should feel literally "as written" — file names, terminal output, raw values.

Don't

• Don't set body copy in RecifeText. It's a display serif — at small sizes the texture gets noisy.
• Don't pair RecifeText with another serif. It's the only serif in the system.
• Don't use Plex Mono for decorative text. It carries a strong "code" connotation; it shouldn't be doing aesthetic duty.

See also

• Typography — full token reference (sizes, weights, line heights, letter spacing)
• Tokens — every CSS variable with raw values