Generates production-grade, WCAG-compliant UI components and design systems across multiple frameworks and industry sectors.
The Universal Design System skill transforms Claude into a sophisticated UI/UX architect powered by a BM25 reasoning engine to provide domain-specific design guidance. It offers a comprehensive foundation of 600+ W3C DTCG tokens, 43 core components, and 9 structural palettes tailored for 57 industry sectors including Fintech, Healthcare, and SaaS. Whether you are building a high-conversion landing page or a data-dense dashboard, this skill enforces strict industry best practices, prevents design anti-patterns, and provides framework-ready output for React, Vue, Svelte, and Tailwind CSS while ensuring automatic WCAG 2.2 AA compliance.
主要功能
01BM25-powered reasoning engine for sector-specific UI/UX recommendations
02600+ W3C DTCG tokens and 43 production-ready component specifications
039 structural palettes covering everything from Minimal SaaS to AI-Futuristic styles
04Multi-framework code generation for React, Vue, Svelte, and Tailwind CSS
05Automatic WCAG 2.2 AA accessibility validation and contrast checking
061 GitHub stars
使用场景
01Building a production-ready, accessible dashboard for regulated industries like finance or healthcare
02Auditing and refactoring existing frontend code to meet accessibility and modern design standards
03Rapidly prototyping a multi-page landing page with consistent typography and color tokens
