Skip to content

Foundations

Typography

Type scale Fonts Tokens Usage

Type rules — what NOT to do

Four constraints the type system holds to. Read these before introducing a new heading style - they're the rules behind why headings feel consistent across every page.

  • Never use leading-none - banned project-wide. Use leading-tight / leading-[1.06] for display.
  • Use text-wrap: balance on every heading (already in base styles).
  • Sub-page hero headings target a 4–6-word compression that wraps to two lines at lg+.
  • Eyebrows are uppercase mono at 12px with 0.12em tracking - the canonical recipe is .u-kicker.
Typography · Tokens
Spacing & layout · Grid