Skip to content

tokens — aesthetic

The tokens. Every value the system resolves from. The source of truth is tokens.json; this page is generated from it, so it cannot drift — what you see is what you ship.

PALETTE

Three inks, the hairline, and the steerable accent + status triplet — light and dark, side by side. Identity comes from the ink; the accent is yours to steer.

light dark
surface the ground
#fcfcfc
#121212
wash a quiet band
#f3f3f3
#1b1b1b
ink body ink
#151515
#ededed
ink-muted supporting ink
#737373
#8f8f8f
ink-faint decoration only
#a3a3a3
#5c5c5c
line the hairline
#e9e9e9
#262626
accent the consumer’s dial
#2643d0
#8c9eff
ok success
#15714b
#6fd2a8
warn warning
#8a5f32
#c49d72
err danger
#a84138
#e58379

TYPE · THE REGISTERS

One size (16px); hierarchy is ink and weight, never scale. Three inks by three weights — nine registers — in Geist and Geist Mono.

400 · regular 550 · medium 800 · black ink Aa Aa Aa muted Aa Aa Aa faint Aa Aa Aa
family
Geist
mono
Geist Mono
size
16px
line-height
1.8

MOTION

Feedback, never decoration: small, brief, eased, and gone under reduced motion. State resolutions are gentler and resolve once.

ease
cubic-bezier(0.23, 1, 0.32, 1)
quick
160ms
soft
240ms
gentle
480ms

LAYOUT

The measure bounds the line length; radius is 0 everywhere — round marks are SVG circles, never a corner.

measure
38rem
measure-wide
68rem
radius
0

CONTRAST

Recomputed whenever a color token changes. The glyph rides the AA verdict; ink and accent clear 4.5:1 against both grounds, in both modes.

TABLE 1 · CONTRAST · LIGHT

ink on surface on wash
ink 17.80 16.46
ink-muted 4.62 4.27
ink-faint 2.46 2.27
accent 7.32 6.77
ok 5.86 5.41
warn 5.44 5.03
err 5.88 5.44

WCAG 2.1 ratios. Faint values are decoration-only by contract — placeholders and resting underlines — and fail 4.5:1 intentionally; nothing interactive rests there.

TABLE 2 · CONTRAST · DARK

ink on surface on wash
ink 16.00 14.71
ink-muted 5.79 5.33
ink-faint 2.80 2.58
accent 7.54 6.93
ok 10.22 9.40
warn 7.50 6.90
err 7.01 6.44

WCAG 2.1 ratios. Faint values are decoration-only by contract — placeholders and resting underlines — and fail 4.5:1 intentionally; nothing interactive rests there.