Start a fresh conversation. Replace the highlighted placeholders.
Use tailwind-design-system to create a Tailwind component foundation for [application], with design tokens, responsive variants, and accessibility requirements.
Required inputs
[application]
User-approved starter prompt based on a pinned source version; check current skill requirements before running. Task evidence ↗
SKILL.md
name: tailwind-design-systemdescription: "Build production-ready design systems with Tailwind CSS, including design tokens, component variants, responsive patterns, and accessibility."risk: safesource: communitydate_added: "2026-02-27"
Tailwind Design System
Build production-ready design systems with Tailwind CSS, including design tokens, component variants, responsive patterns, and accessibility.
Use this skill when
Creating a component library with Tailwind
Implementing design tokens and theming
Building responsive and accessible components
Standardizing UI patterns across a codebase
Migrating to or extending Tailwind CSS
Setting up dark mode and color schemes
Do not use this skill when
The task is unrelated to tailwind design system
You need a different domain or tool outside this scope
Instructions
Clarify goals, constraints, and required inputs.
Apply relevant best practices and validate outcomes.
Provide actionable steps and verification.
If detailed examples are required, open resources/implementation-playbook.md.
Resources
resources/implementation-playbook.md for detailed patterns and examples.
Limitations
Use this skill only when the task clearly matches the scope described above.
Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.