Foundations

Every value here is a semantic token, not a palette pick. Toggle dark mode in the sidebar to see the same tokens carry the whole system.

Surfaces

canvas

surface

inset

Text

fg-muted

fg-subtle

Borders

border

border-strong

Controls

control

control-hover

Accent

accent

accent-strong

accent-muted

accent-text

accent-fill

ring

Status

success

warning

danger

success-muted

warning-muted

danger-muted

Typography

Plus Jakarta Sans for UI text, IBM Plex Mono for code and data. One component — Text — owns the scale and tones.

Page title

page-title · default

Section title

section-title · default

Item title

title · default

Body text — the UI default at 14px

body · default

Caption — descriptions and secondary info

caption · muted

Small — tertiary info

small · muted

Overline — group labels

overline · subtle

0123456789 — mono data

mono · default

bun run dev — inline code

code · default

Radius & elevation

A hierarchy, not a single value: precise small controls, soft inputs, visibly rounded panels and cards, expressive dialogs and feature surfaces.

rounded-xs

rounded-sm

rounded-md

rounded-lg

rounded-xl

rounded-2xl

rounded-3xl

rounded-full

shadow-1

shadow-2