Colors
High-contrast scales for a black canvas. Click a swatch to copy var(--ds-…).
How the scale works
Each hue uses the same 100–1000 ladder. Gray Alpha is for hairlines on both themes.
100Default component background
200Hover background
300Active background
400Default border
500Hover border
600Active border
700High-contrast fill (accents, badges)
800Hover high-contrast fill
900Secondary text and icons
1000Primary text and icons
Backgrounds
Gray
Gray Alpha
Blue
Red
Amber
Green
Teal
Purple
Pink
Semantic aliases
--ds-success→--ds-green-700--ds-error→--ds-red-700--ds-warning→--ds-amber-700--ds-focus— focus ring. Dark: #47a8ff