tailwind-v4-configuration
CommunityCSS-first Tailwind v4 setup & migration
AuthorThomashighbaugh
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Provides a complete, CSS-first guide to install, migrate, and configure Tailwind CSS v4 so teams can adopt the new @theme workflow, unified toolchain, and modern utilities without guesswork or trial-and-error.
Core Features & Use Cases
- Installation guidance for Vite, PostCSS, and the standalone CLI with recommended plugin settings.
- Migration steps and examples to convert tailwind.config.js patterns into CSS @theme tokens and resolve breaking utility changes.
- Theme customization, scoped stylesheets, custom utilities, and plugin registration via @plugin for framework and multi-package setups.
- Framework-specific examples for Next.js, React, Vue, and SvelteKit, plus troubleshooting and performance tips.
Quick Start
Initialize Tailwind v4 by adding a single @import tailwindcss line to your main CSS, define theme tokens in an @theme block, and install the matching build plugin for your toolchain.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: tailwind-v4-configuration Download link: https://github.com/Thomashighbaugh/opencode/archive/main.zip#tailwind-v4-configuration Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.