This skill provides a comprehensive framework for creating predictable, scalable, and scannable naming systems for design assets, components, and tokens. By implementing specific syntax rules for files, React components, CSS, and design tokens, it bridges the gap between design files and production code. It is essential for teams looking to eliminate ambiguity, improve searchability, and maintain a professional design system grounded in industry standards like SWEBOK and TOGAF.
Key Features
019 GitHub stars
02Structured asset organization for icons and illustrations
03Error mitigation for common pitfalls like visual-only naming
04Standardized component naming patterns (category/name/variant/state)
05Multi-platform coding conventions including PascalCase and kebab-case
06Semantic design token structures for property-based styling
