The three-layer rule01
21
Primary
Display face carries the one hero number per screen. Everything else supports.
Display · Doto02
72 / xlAa 09
48 / lgAa 09
36 / mdAa 09
Display face — hero numbers, time readouts, the one break-the-pattern moment. Never used for body copy or under 36 px.
Body · Space Grotesk03
36 / h1
A design system that reads its own tokens.
24 / h2
A design system that reads its own tokens.
18 / h3
A design system that reads its own tokens.
16 / body
Design tokens describe a look once and let every page inherit it.
14 / sm
Secondary body — captions, meta, list rows where density matters.
Label · Space Mono04
12 / cap2026 · aug · 07 — 21:41
11 / labelInstrument-panel label
14 / data$14,972 +0.017%
Monospaced numerals, ALL CAPS for labels, tabular-nums for data. This face is the instrument-panel voice.