🎨 Tokens

Every value is an RGB triplet on :root, so it composes with an alpha channel: rgb(var(--ndo-primary-500) / 0.4). The numbered scales are absolute and never redefined; only the semantic layer flips in dark mode.

Primary — the action color

50
100
200
300
400
500
600
700
800
900

Gray — the canvas

50
100
200
300
400
500
600
700
800
900
950

Domain families

Lifecycle

gray
indigo
amber
green
teal
emerald
yellow
orange
red

Nature

blue
purple
sky
teal
indigo

Regime

gray
cyan
violet
rose
emerald

Semantic surface

  • --ndo-color-bg-app
  • --ndo-color-surface
  • --ndo-color-border
  • --ndo-color-text-primary
  • --ndo-color-text-secondary
  • --ndo-color-text-muted
  • --ndo-color-link

Type

Display --ndo-text-3xl
Heading 1 --ndo-text-2xl
Heading 2 --ndo-text-xl
Heading 3 --ndo-text-lg
Body --ndo-text-base
Small --ndo-text-sm
Caption --ndo-text-xs

Monospace: --ndo-font-mono — used for hashes and keys.

Spacing, radii, elevation

Spacing

0-5
1
1-5
2
3
4
5
6
8
12

Radii — 8px is the base; pill is for badges and dots

sm
md
lg
xl
pill

Elevation

sm
md
lg
xl