Shadcn Setup & Theming

Acerca de

This specialized skill streamlines the entire lifecycle of shadcn/ui integration, from initial CLI installation and components.json configuration to advanced theme customization. It ensures seamless Tailwind CSS wiring, manages design tokens like radius and color palettes, and provides robust troubleshooting for misconfigured setups. Whether you are bootstrapping a new Next.js project or refining a Vite app, this skill maintains a consistent design system while handling dark mode implementation and essential utility helpers like the cn() function.

Características Principales

• Automated configuration of components.json and Tailwind CSS integration
• Dark mode implementation using class-based strategies and theme providers
• Design system token management for colors, typography, and border radius
• Diagnostics and repair for broken shadcn installations and import paths
• 1 GitHub stars
• Support for both Next.js App Router and Vite-based project structures

Casos de Uso

• Setting up a production-ready shadcn/ui environment in a new React project
• Fixing broken Tailwind configuration or incorrect component import aliases
• Customizing the global design system to align with brand-specific colors and typography