Surface tokens
--bg, --surface, --fg, --muted, --border. The whole page derives from these five names; rebind them for any other brand and the layout follows.
Inspect tokens →Reference fixture · default
One source for the values your team keeps re-deciding.
A starter pack that turns brand decisions into shippable tokens — colors, type, spacing — so every interface inherits the same answer instead of reaching for a default.
What this fixture exercises
Every component below uses only var(--*) — no raw hex, no off-token type.
Accent discipline
--accent appears at most twice on this screen — the primary CTA and the focus ring. The hero status uses --success instead, so the page does not feel mono-blue.
Read the rule →Type rhythm
Display and body share Inter but differ in size, weight, and tracking. No third type face, no fourth size on this screen.
Inspect typography →Form components
Inputs inherit the same tokens.
Focus rings, borders, placeholder color — all derive from --accent and --border. The submit button reuses .btn-primary unchanged. No new token introduced for this section.