tailwind-v4

Tailwind CSS v4 usage guide and v3-to-v4 differences. This skill should be used when writing, reviewing, or refactoring any Tailwind CSS code in this repo. Triggers on tasks involving Tailwind classes, @theme blocks, CSS-first configuration, or cleanup of v3-era syntax.

Quality

85%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Quality

Content

85%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A tight, highly actionable reference dense with exact v3-to-v4 mappings and concrete guidance, well-organized and self-contained. The only weakness is time-sensitive version pining that is not segregated into an old-patterns section, which slightly hurts conciseness.

Suggestions

Move the pinned-version prose ("4.2.2 at the time of writing" and the v4.2/v4.3 availability notes) into a short, clearly labeled "Version" or "Deprecated/old" subsection so the main guidance stays evergreen and token-lean.

Consider trimming the inline minor-version availability list to the single most relevant pointer (the upgrade-guide URL) to reduce time-sensitive detail.

Dimension	Reasoning	Score
Conciseness	The body is dense and assumes Claude's CSS/Tailwind competence with no basic-concept padding, but the un-segregated time-sensitive version pin ("4.2.2 at the time of writing" plus minor-version availability notes) adds tokens the rubric penalizes when not placed in a deprecated/old-patterns section.	2 / 3
Actionability	Do/don't and v3/v4 tables give exact, copy-paste-ready class spellings, directives, and replacements throughout (e.g. "bg-gradient-to-r" -> "bg-linear-to-r", "min-w-[400px]" -> "min-w-100"); no pseudocode.	3 / 3
Workflow Clarity	As a reference/lookup skill with no destructive or batch operations, it needs no validation checkpoints; its decision-oriented sections ("Prefer generated utilities over arbitrary values", "Don't hand-write CSS or JS for what a variant covers", "reach for these before hacks or JS") make the single action unambiguous.	3 / 3
Progressive Disclosure	No bundle files exist (references/scripts/assets absent) and the skill is self-contained with well-organized, clearly headed sections; the few inline doc URLs are one-level and clearly signaled, with no nested references.	3 / 3
	Total	11 / 12 Passed

Description

85%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong description that clearly answers what the skill does and when to use it, with concrete actions and a well-scoped niche. Trigger-term coverage is good but leans on technical jargon and omits natural migration phrasings a user might say.

Suggestions

Add natural user-facing trigger phrases such as "upgrade", "migrate", or "Tailwind 4" alongside the technical terms so the description matches how users actually phrase v3-to-v4 migration requests.

Consider trimming the jargon-heavy trigger list (e.g. "CSS-first configuration") in favor of one or two plain-language equivalents to improve trigger-term quality.

Dimension	Reasoning	Score
Specificity	The trigger clause names multiple concrete actions ("writing, reviewing, or refactoring any Tailwind CSS code") and concrete objects ("Tailwind classes, @theme blocks, CSS-first configuration, ... cleanup of v3-era syntax"), beyond a single domain action.	3 / 3
Completeness	Explicitly states what ("usage guide and v3-to-v4 differences") and when ("This skill should be used when... Triggers on...") with explicit trigger guidance, satisfying the what-and-when requirement.	3 / 3
Trigger Term Quality	Several natural terms appear ("Tailwind CSS code", "Tailwind classes", "reviewing", "refactoring"), but common user variations like "upgrade/migrate Tailwind" are missing and some triggers ("@theme blocks", "CSS-first configuration", "v3-era syntax") are technical jargon rather than user-natural phrasing.	2 / 3
Distinctiveness Conflict Risk	Scopes to a distinct niche (Tailwind v4 vs v3 migration) with concrete trigger objects unlikely to fire for unrelated skills.	3 / 3
	Total	11 / 12 Passed

Validation

100%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository: mastra-ai/mastra
Path: .claude/skills/tailwind-v4/SKILL.md
Commit: 3b78ed9

Reviewed: about 23 hours ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.