Individual skill
design-system-patterns
Build scalable design systems with design tokens, theming infrastructure, and component architecture patterns. Use when creating design tokens, implementing theme switching, building component libraries, or establishing design system foundations.
plugins/ui-design/skills/design-system-patterns/SKILL.md
Source commit 4bde3168b43c0655c4d00ea2726e631719908a6d
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- Yes
- Repository scan complete
- No
- Skill scan complete
- No
- Observed behavior
- Local scripts
- Last checked
- Nov 9, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 42,338
- Repository last updated
- Nov 9, 2026
- License
- MIT
Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.
- anthropic Repository topic
- agent-skills Repository topic
- agentic-ai Repository topic
- ai-agents Repository topic
- cursor Repository topic
- cursor-rules Repository topic
- mcp Repository topic
- multi-agent Repository topic
- opencode Repository topic
- claude-code Repository topic
- engineering Derived category
- design Derived category
- devops Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
SKILL.mdcore · 4,003 bytesreferences/component-architecture.mddoc · 15,293 bytesreferences/design-tokens.mddoc · 11,269 bytesreferences/details.mddoc · 5,566 bytesreferences/theming-architecture.mddoc · 12,365 bytes
Read excerpt
# Design System Patterns
Master design system architecture to create consistent, maintainable, and scalable UI foundations across web and mobile applications.
## When to Use This Skill
- Creating design tokens for colors, typography, spacing, and shadows
- Implementing light/dark theme switching with CSS custom properties
- Building multi-brand theming systems
- Architecting component libraries with consistent APIs
- Establishing design-to-code workflows with Figma tokens
- Creating semantic token hierarchies (primitive, semantic, component)
- Setting up design system documentation and guidelines
