tailwind-v4-shadcn - Configure Tailwind v4 with shadcn/ui
Sets up Tailwind v4 and shadcn/ui with CSS variables, @theme mappings, base styles, and automatic dark-mode support.
Tags
Updated: 2026-10-05Capabilities
Typical Inputs
Typical Outputs
What this skill does
- Install required dependencies
- Configure the Vite plugin
- Define CSS theme variables
- Map variables to utilities
- Apply base styles
- Set up dark mode
- Migrate v3 configuration
- Diagnose documented errors
Inputs
- React project
- Vite configuration
- CSS entry file
- components.json
- Existing Tailwind v3 configuration
- Theme requirements
Outputs
- Updated project configuration
- Installed package dependencies
- CSS variable definitions
- Tailwind utility mappings
- Dark-mode theme switching
- Resolved configuration errors
Requirements
- React project
- Vite build setup
- pnpm package manager