tailwind-4-docs

Syncs and queries a local Tailwind CSS v4 documentation snapshot for migration and implementation guidance.

Updated Aug 2, 2026
One-click install
npx skills add https://github.com/jeje-it/template-projet --skill tailwind-4-docs-jeje-it
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tailwind-4-docs
Source: https://github.com/jeje-it/template-projet/tree/main/.agents/skills/tailwind-4-docs
Command: npx skills add https://github.com/jeje-it/template-projet --skill tailwind-4-docs-jeje-it

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve? Tailwind CSS v4 introduced breaking changes in imports, tooling, utilities, and variants, and developers often lack accurate, up-to-date official documentation when answering configuration or migration questions. This Skill provides a locally synced snapshot of the official Tailwind v4 docs plus an engineering playbook so answers are grounded in real documentation. ## Core Features & Use Cases - Local docs snapshot: Syncs the official tailwindcss.com documentation into references/docs/ with an index for fast topic lookup. - Migration guidance: Covers v3-to-v4 upgrade checks including new import syntax, tooling packages, utility renames, and variant behavior. - Engineering playbook: Provides implementation, refactor, and review heuristics for tokens, custom utilities, component classes, and @apply usage. - Use Case: When upgrading a project from Tailwind v3 to v4, ask the assistant to verify breaking changes; it loads the upgrade guide and gotchas reference to flag issues like @tailwind directive removal and renamed utilities. ## Quick Start Ask the assistant to initialize the Tailwind docs snapshot and then explain how to migrate your project from Tailwind v3 to v4.

Frequently Asked Questions about tailwind-4-docs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate a project from Tailwind CSS v3 to v4?▼

Tailwind v4 migration requires replacing `@tailwind` directives with `@import "tailwindcss"`, moving to `@tailwindcss/postcss` or `@tailwindcss/vite`, and checking renamed utilities. This Skill loads the official upgrade guide and gotchas list to verify each breaking change.

How do I configure Tailwind CSS v4 without a config file?▼

Tailwind v4 uses a CSS-first configuration where design tokens are declared with `@theme` inside your stylesheet. Tokens defined in `@theme` generate utilities and variants, while plain CSS variables belong in `:root`.

Does Tailwind CSS v4 support older browsers?▼

Tailwind v4 targets modern browsers only: Safari 16.4+, Chrome 111+, and Firefox 128+. Projects requiring older browser support should stay on v3 or verify compatibility against the official compatibility documentation.

Why are my dynamically generated Tailwind classes not working?▼

Tailwind scans source files as plain text, so classes built by string concatenation are not detected. Use full class strings, `@source` for unusual locations, or `@source inline()` only when safelisting is truly necessary.

What are the limitations of this Tailwind docs skill?▼

The docs snapshot is not bundled and must be initialized by running the sync script with git, Python 3, and internet access. If initialization is blocked, only the gotchas and engineering playbook references are available as a limited fallback.