Description
tailwind-design-system is an agent skill for building production-ready design systems with Tailwind CSS. It covers design tokens, component variants, responsive patterns and accessibility, and it helps you standardise UI patterns across a codebase. Use it when you are creating a component library with Tailwind, implementing design tokens and theming, building responsive and accessible components, migrating to or extending Tailwind CSS, or setting up dark mode and colour schemes. The skill sets out when not to use it, which is for tasks outside Tailwind design systems. It is part of the sickn33/agentic-awesome-skills repository on GitHub, which has about 47,600 stars. The listing shows it as free, and it has about 1,600 installs. Its security audits show passes from Gen Agent Trust Hub, Socket and Snyk. Install it with npx skills add https://github.com/sickn33/agentic-awesome-skills --skill tailwind-design-system.…
Highlights
- Design tokens and theming
- Component variants
- Responsive patterns
- Accessibility in components
- Dark mode and colour schemes
Ratings & Reviews
No ratings yet
Be the first to rate tailwind-design-system.
People also visit
tailwind-design-system FAQ
What does it cover?
Design tokens, component variants, responsive patterns, accessibility, theming and dark mode with Tailwind CSS.
When is it useful?
For component libraries, standardised UI patterns, and migrating to or extending Tailwind.
How do I install it?
Run npx skills add https://github.com/sickn33/agentic-awesome-skills --skill tailwind-design-system.
Is it checked for security?
Its security audits show passes from Gen Agent Trust Hub, Socket and Snyk.
Does it cover dark mode?
Yes. The skill covers setting up dark mode and colour schemes.
What are the best tailwind-design-system alternatives?
Popular alternatives to tailwind-design-system include extract, design-system and design-system. See all tailwind-design-system alternatives