Design System Skill

Degree of freedom: MIXED. Token taxonomy and variants [HIGH freedom]; existing ui/ / token inventory [LOW freedom — run exactly].

Build scalable, maintainable design systems with consistent tokens, variants, and documentation.

How to reason

1. Inventory — components/ui, tokens, cva, shadcn/Radix
2. Tokenize — semantic tokens, not raw hex in components
3. Variant — cva covers real states (default/destructive/disabled)
4. Document — JSDoc, keyboard/focus, dark mode

Worked example