design-system-starter

原文涵盖的主题

• Design System Starter
• Quick Start
• Triggers
• Quick Reference
• Bundled Resources
• Design System Philosophy
• What is a Design System?
• Core Principles

Build robust, scalable design systems that ensure visual consistency and exceptional user experiences. -- Just describe what you need: That's it. The skill provides tokens, components, and accessibility guidelines. -- | Trigger | Example | |---------|---------| | Create design system | "Create a design system for my app" | | Design tokens | "Set up design tokens for colors and spacing" | | Component architecture | "Design component structure using atomic design" | | Accessibility | "Ensure WCAG 2.1 compliance for my components" | | Dark mode | "Implement theming with dark mode support" | -- | Task | Output | |------|--------| | Design tokens | Color, typography, spacing, shadows JSON | | Component structure | Atomic design hierarchy (atoms, molecules, organisms) | | Theming | CSS variables or ThemeProvider setup | | Accessibility | WCAG 2.1 AA compliant patterns | | Documentation | Component docs with props, examples, a11y notes | -- references/component-examples.md - Complete component implementations templates/design-tokens-template.json - W3C design token format templates/component-template.tsx - React component template checklists/design-system-checklist.md - Design system audi

这里只展示节选，请以完整原文和当前要求为准。