Skill Tailwind
Community skill for writing, migrating, and reviewing Tailwind CSS v4 — MIT licensed.
About
skill-tailwind is an open-source agent skill (MIT) that teaches coding agents how to implement Tailwind CSS v4 correctly. The SKILL.md entry point covers the CSS-first configuration model, semantic design tokens on CSS variables, dark mode, and the two equal organizational styles — utility-first markup and BEM with @apply — while docs/, references/, examples/, and templates/ carry the depth. It's particularly useful for v3→v4 migrations, where the new @theme, @source, and @reference directives trip up even experienced developers.
Worth knowing: it's an implementation layer, not a design one — it wires Tailwind correctly but doesn't pick a visual direction, and token values are replaceable placeholders. As a community project by a single author, it lags official Tailwind releases, so verify against the current Tailwind docs for edge cases.
What it can do
- Tailwind v4 CSS-first configuration guidance
- v3 to v4 migration checklist and gotchas
- Design tokens and dark mode on CSS variables
- Utility-first vs @apply organizational reasoning
- Code review checklists for Tailwind markup
Setup
git clone https://github.com/rekryt/skill-tailwind.git ~/.claude/skills/skill-tailwind — auto-discovered by Claude Code, or install via npx skills add.
Prerequisites
Claude Code, Cursor, or another skill-compatible agent; a project using Tailwind CSS v4.
Use cases
Works with
Trust score — 7/10
Scored 7/10 (metrics tier, metrics-v1). Evidence: Verified via vendor site/docs/GitHub and reputable coverage, wave 56; Trending score 68/100 from researcher assessment.
Sources
Every fact above was checked against these sources. Where a claim comes from the provider and couldn't be independently verified, the text says so.