Does it automatically fix my configuration files?

It provides a --suggest-fixes flag that offers the specific code changes needed to align with v4 standards, allowing for quick manual or semi-automated updates.

Does this skill support Tailwind CSS v3?

No, this skill is specifically designed to identify v3 patterns as legacy issues and help users migrate to the improved v4 architecture.

Why should I move to a CSS-first configuration?

Tailwind v4 moves away from JavaScript-based configs to native CSS @theme blocks, which simplifies the build process and leverages modern CSS features.

Can I use this in my GitHub Actions?

Yes, the skill includes a strict mode and a CI flag, making it ideal for automated linting and validation within CI/CD pipelines.

Tailwind 4 Validator

Name: Tailwind 4 Validator
Author: shipshitdev

byshipshitdev

•

Design Tools

Validates Tailwind CSS v4 configurations and prevents outdated version 3 patterns to ensure a modern, CSS-first setup.

The Tailwind 4 Validator is a specialized Claude Code skill designed to audit and maintain modern frontend projects by identifying legacy Tailwind v3 patterns and guiding users toward the v4 CSS-first approach. It automatically detects deprecated JavaScript configuration files, flags outdated directives, and verifies the implementation of new @theme blocks. By providing clear migration paths and strict validation modes, this tool ensures that both human-written and AI-generated code remains compliant with the latest Tailwind standards, reducing technical debt and improving build efficiency.

Key Features

01Detects and flags legacy tailwind.config.js files for migration

02Validates the presence of v4 @theme blocks and CSS-first configuration

03Checks package.json for compatible Tailwind v4+ dependencies

04Provides automated fix suggestions and strict mode for CI/CD pipelines

05Identifies outdated @tailwind directives and suggests @import replacements

0610 GitHub stars

Use Cases

01Auditing AI-generated styling to ensure it does not use legacy patterns

02Integrating into CI/CD workflows to prevent configuration regressions

03Migrating an existing project from Tailwind CSS v3 to v4

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add shipshitdev/library tailwind-validator

For use in Claude.ai and ChatGPT

Download Skill