design-system
SolidUse when starting any design task, before choosing or auditing a color/type/spacing token or writing design-system.md — routing step 1.
Install
Quality Score: 87/100
Skill Content
Details
- Author
- fusengine
- Repository
- fusengine/agents
- Created
- 8 months ago
- Last Updated
- 6 days ago
- Language
- CSS
- License
- MIT
Similar Skills
Semantically similar based on skill content — not just same category
design-system
Use when a ticket needs a *systematic* token + component foundation for a frontend — the three-layer token architecture (primitive → semantic → component), component specs with full state coverage, or a recommendation for which design system a product should have. Invoke for "set up design tokens", "define the component system", "we keep hardcoding colours — fix it", "what design system should this product use", or as the structural backbone that `frontend-design` and `brand` build distinctive UI on top of.
design-system
Use when defining or extending design tokens and the shared component library — by product-designer when writing docs/13-design-tokens.md and docs/14-components.md, and by any IC about to add a component. Triggers the moment a value would be hardcoded instead of named, or a one-off component would be created instead of composed.
design-system
Establish a design system where there is none, and enforce the one that exists so violations fail a check instead of surviving code review. Covers token layers, the traps that make tokens quietly wrong (alpha over variables, contrast by threshold, a token that cannot express a state), and the four gates that keep drift out. Use for: design system, design tokens, tokens, theme, dark mode, light mode, colores del sistema, hardcoded colors, /design-system, esto no respeta el design system, unificar estilos.