Typography

Inter for display. Geist Mono for code. Legibility over personality.

Typefaces

Display

Inter

All contexts: UI, marketing, docs, print. Optically precise, technically neutral.

Code

Geist Mono

Code blocks, terminal output, technical values. Fallback: IBM Plex Mono.

Type scale

Display56px · Bold (700) · 1.1

Hero sections and key moments

H140px · Semi (600) · 1.2

Page titles

H228px · Semi (600) · 1.3

Section headings

H320px · Semi (600) · 1.4

Subsection headings

Body Large18px · Regular (400) · 1.6

Lead paragraphs, callouts, and feature intros use this size for emphasis without heading weight.

Body16px · Regular (400) · 1.6

Default body copy. This is the workhorse — most content on the site uses this size. Aim for 65–75 characters per line.

Body Small14px · Regular (400) · 1.5

Supporting text, captions, and helper text.

Label12px · Medium (500) · 1.4

UI LABELS, TAGS, AND METADATA

Code14px · Regular (400) · 1.6

const flow = qpoint.inspect({ target: "api.example.com" })

Rules

  • Sentence case for headings. Never all-caps at heading level.
  • Weight for hierarchy, not decoration. Default body is 400.
  • Italics for technical terms and citation only.
  • Body line length: 65–75 characters. Don't skip heading levels.