design-system-patterns - Scalable design system architecture patterns
Foundation for design tokens, theming infrastructure, token pipelines, and governance
Tags
Updated: 2026-06-15Capabilities
Typical Inputs
Typical Outputs
What this skill does
- Define token hierarchy
- Implement theme switching
- Build token pipeline
- Create multi-brand themes
- Generate platform tokens
- Apply accessibility rules
- Prevent FOUC
Inputs
- Token source files
- Theme preferences
- Brand specifications
- React components
- Platform configuration
Outputs
- Token variable files
- Theme provider component
- Platform token files
- Applied theme attributes
- Accessibility tokens
Requirements
- React framework
- Style Dictionary
- CSS custom properties
- localStorage
- System theme detection
- SSR environment
