Foundations
Typography
Three families with strict roles: Clash Display for headlines, Geist for UI, Geist Mono for data + meta. The tweaks panel lets users swap Mono for Fira Sans Condensed or Fira Sans.
Display scale
.display-xxl · clamp(56–168px)Atelier
.display-xl · clamp(44–96px)Pretium
.display-l · clamp(32–56px)Subtilitas
.display-m · clamp(24–36px)Eleganter
.display-s · 22pxCompositio
UI text
Body 16 — paragraph copy in long-form pages, journal entries.Body 14 — default product UI size.mono 12 · 0123456789 · €1,248.00 · MM/DDEyebrow · 11px · letter-spacing .14em · uppercase
Underline header — 4 flavors
Editorial signature treatment. Use sparingly: one underlined heading per viewport.
A · Short bar
Foundations
B · Full rule
Foundations
C · Keyword
The vocabulary of interfaces.
D · Marker
Now showing — Atelier
Font variables
| Variable | Default | Role |
|---|---|---|
| --font-display | Clash Display | Display headlines (.display-*) |
| --font-ui | Geist | Default body + UI |
| --font-mono | Geist Mono | Code, kbd, tabular numbers (.mono) |
| --font-meta | Geist Mono | Eyebrows, labels (.font-meta). Swappable to Fira Condensed via Tweaks. |
| --font-data | Geist Mono | Numbers in tables (.font-data). Swappable to Fira via Tweaks. |