Design Studio
The neutral ramp every gray token is derived from.
The accent color for buttons, links, and focus rings.
Shade
neutral-900oklch(0.205 0 0)Text tone that sits on the primary color.
Light
Background
Foreground
Primary
Secondary
Muted
Accent
Border
Ring
Dark
Background
Foreground
Primary
Secondary
Muted
Accent
Border
Ring
Northwind
Design once, ship on-brand everywhere
A cohesive design system your AI coding agent can extend — colors, type, and components that stay consistent as you scale.
Ships fast
Production-ready tokens your agent can build on without guesswork.
On-brand
Every color, font, and radius stays consistent across the system.
Designed
Looks intentional — not generated — from the first component.
Ready to look designed?
Export a machine-readable design system and hand it to your agent.