Skip to content
Raster
  • System
  • Light
  • Dark
  • High contrast

Typography

Type scale

Section titled “Type scale”

All sizes are defined as CSS custom properties and map to the design token scale.

Heading 1 — 3xl bold

—font-size-3xl

Heading 2 — 2xl bold

—font-size-2xl

Heading 3 — xl semibold

—font-size-xl
Large body—font-size-lg
Base body (default)—font-size-base
Small / caption—font-size-sm
Extra small / labels—font-size-xs
Section titled “Links”

Text links within body copy are always underlined. Underlines provide a universal, colour-independent cue that text is interactive. Users who cannot distinguish the link colour from surrounding text can still identify links by the underline.

This paragraph contains an underlined link that is always visually distinct.

Nav links (breadcrumbs, top bar) suppress the underline because the interactive region is unambiguous from context. The underline is restored on :hover.

Colour

Section titled “Colour”

Link colour uses --color-interactive (#1d4ed8), which achieves a contrast ratio above 4.5:1 on the default white background — meeting WCAG SC 1.4.3.