tailwind-v4-shadcn - Set up Tailwind CSS v4 with shadcn/ui
Configure production-tested Tailwind CSS v4 integrations with shadcn/ui, Vite, React, CSS variables, semantic colors, and dark mode.
Tags
Updated: 2026-09-30Capabilities
Typical Inputs
Typical Outputs
What this skill does
- Configure Vite integration
- Set up shadcn/ui
- Define CSS color variables
- Map variables to utilities
- Implement dark mode
- Debug theme switching
- Fix color rendering issues
- Migrate Tailwind v3 patterns
Inputs
- React project
- Vite configuration
- shadcn/ui configuration
- CSS source file
- Theme requirements
- Package manager
Outputs
- Configured project files
- CSS theme variables
- Vite plugin configuration
- shadcn/ui components
- Dark mode behavior
- Theme troubleshooting changes
Requirements
- React and Vite environment
- Tailwind CSS v4 support
- Node package manager
- Project file access