shadcn · Design system breakdown
Not a library — a registry of components you copy and own.
shadcn launched in late 2023 as a deliberately anti-library design system: components are not installed as a dependency but copied into your codebase via a CLI. The model became the de facto starter for new React + Tailwind + Radix projects in 2024–2026.
Single-maintainer-led, open source, MIT. Community contributions plus a growing registry ecosystem (other authors publish shadcn-compatible component sets).
| Token | Value | Role |
|---|---|---|
| --background | 0 0% 100% (HSL) | Page surface |
| --foreground | 0 0% 3.9% (HSL) | Default text |
| --primary | Theme-defined | Primary action |
| --muted-foreground | 0 0% 45.1% (HSL) | Secondary text |
| --radius | 0.5rem | Default radius |
| --border | 0 0% 89.8% (HSL) | Default border |
Token names and values are illustrative — refer to the system's official tokens reference for the canonical, current set.
If you're evaluating this system
Pick shadcn/ui as a starting point for any new React + Tailwind project where you want a clean substrate to build your own design system on top of. It's not an end-state design system — it's the best public starting kit.
Compare more systems