Foundation
19+ tokens · :root
The palette, in full.
Warm paper neutrals, one brand accent, fixed data hues — tuned for calm, dense application surfaces. A named surface ladder (canvas → card → recessed → tint) with hairline depth. It owns your :root, install with init.
background
card
muted
secondary
accent
border
foreground
muted-fg
brand
brand/10
success
warning
destructive
chart-2
chart-3
act·thinking
act·search
act·read
act·edit
the base owns :root, install once
Radius scale
from --radius
sm
md
lg
xl
2xl
3xl
4xl
Depth is a hairline
No drop shadows. A single inset edge catches light so a surface sits into its background.
edge
hairline, the house model
none
dissolves into the page
House utilities
Texture and treatments the foundation ships, reuse instead of re-rolling.
bg-grid
glow-brand
text-gradient-brand
reading-ui · 65ch docs lane
reading-ui
reading-prose · 65ch essay lane
reading-prose
fades softly at both edges as it runs past the frame
mask-fade-x
Surface hierarchy
calm · small steps · hairline
App surfaces sit on a named ladder of small luminosity steps, separated by the edge hairline — not by shadows or heavy cards. Reach for a role by name; never hand-tune a one-off gray.
canvas · bg-background
base · bg-card edge
recessed · bg-muted/30
tint / selected · bg-brand/10
Type tokens
font-sans
font-mono
font-serif
Three families carry the whole type scale, and long-form copy routes through the reading lanes (reading-ui and reading-prose).
Why we chose thisThe type systemOne knob re-skins it
Override --brand and rings, charts, success, and active states all follow — theming re-skins the whole system from this one variable.