skills.homes logoskills.homescapability registry
home/categories/architecture-patterns/jezweb-claude-skills-skills-tailwind-v4-shadcn-skill-md
cd ..
architecture-patternsdevelopment

tailwind-v4-shadcn

Set up Tailwind v4 with shadcn/ui using @theme inline pattern and CSS variable architecture. Four-step pattern: CSS variables, Tailwind mapping, base styles, automatic dark mode. Use when initializing React projects with Tailwind v4, or fixing colors not working, tw-animate-css errors, v3 migration.

查看源碼architecture-patterns
jezweb
maintainer
jezweb
更新於 1/19/2026
星標
166
分支
21
quick start

Installation and usage

Set up Tailwind v4 with shadcn/ui using @theme inline pattern and CSS variable architecture. Four-step pattern: CSS variables, Tailwind mapping, base styles, automatic dark mode. Use when initializing React projects with Tailwind v4, or fixing colors not working, tw-animate-css errors, v3 migration.

安裝
$ install --globalskills.sh
使用

安裝後，您可以通過在終端運行以下命令來使用此技能：

skills use tailwind-v4-shadcn