Design AI Skills
Design smarter with AI-assisted creative tools
Design skills bridge the gap between concept and implementation. Generate UI components, color palettes, design tokens, accessibility audits, and responsive layouts - all from natural language descriptions. Perfect for developers who need design output without switching to graphical tools.
What design skills can do for you
UI Component Generation
Describe what you need and get production-ready React, Vue, or HTML components. Skills produce accessible, responsive code that follows modern design patterns and your existing design system.
Design System Tools
Generate color palettes, typography scales, spacing systems, and design tokens. Maintain consistency across your project with skills that understand design fundamentals.
Accessibility Auditing
Run WCAG compliance checks, generate aria labels, and fix contrast issues. Skills catch accessibility problems before they reach production and suggest concrete fixes.
All Design Skills
No design skills yet
Browse all skillsCommon questions about design skills
What UI frameworks do design skills support?
Design skills generate components for React, Vue, Svelte, Astro, and plain HTML/CSS. Most skills auto-detect your framework from the project context and generate appropriate code.
Can skills generate entire page layouts?
Yes. Layout skills can generate full page structures from descriptions like 'pricing page with 3 tiers' or 'dashboard with sidebar navigation'. Output is responsive and production-ready.
How do accessibility skills work?
Accessibility skills scan your components for WCAG 2.1 violations - missing alt text, insufficient contrast, keyboard navigation gaps, and screen reader compatibility. They provide specific fixes, not just warnings.
Ready to supercharge your
design workflow?
Browse verified design skills and agents built by the community. One-command install, instant results.