skills.homes logoskills.homescapability registry
home/categories/full-stack/hopeoverture-worldbuilding-app-skills-plugins-tailwind-shadcn-ui-setup-skills-tailwind-shadcn-ui-setup-skill-md
cd ..
full-stackdevelopment

tailwind-shadcn-ui-setup

This skill should be used when setting up, configuring, or initializing Tailwind CSS (v3 or v4) and shadcn/ui for Next.js 16 App Router projects. Configure dark mode, design tokens, base layout with header/sidebar, accessibility defaults, and generate example components. Includes comprehensive setup automation, theme customization, and production-ready patterns. Use when the user requests "setup Tailwind", "configure shadcn/ui", "add dark mode", "initialize design system", or "setup UI framework" for Next.js projects.

Voir le code sourcefull-stack
hopeoverture
maintainer
hopeoverture
Mis à jour 11/11/2025
Étoiles
1
Forks
0
quick start

Installation and usage

This skill should be used when setting up, configuring, or initializing Tailwind CSS (v3 or v4) and shadcn/ui for Next.js 16 App Router projects. Configure dark mode, design tokens, base layout with header/sidebar, accessibility defaults, and generate example components. Includes comprehensive setup automation, theme customization, and production-ready patterns. Use when the user requests "setup Tailwind", "configure shadcn/ui", "add dark mode", "initialize design system", or "setup UI framework" for Next.js projects.

Installation
$ install --globalskills.sh
Utilisation

Après l'installation, vous pouvez utiliser ce skill en exécutant la commande suivante dans votre terminal :

skills use tailwind-shadcn-ui-setup