What problem does it solve? Building consistent, accessible, and responsive user interfaces from scratch is slow and error-prone. This Skill provides a complete workflow for composing UIs with shadcn/ui components (built on Radix UI primitives), styling them with Tailwind CSS utilities, and producing canvas-based visual designs, so you avoid reinventing component patterns, theme systems, and accessibility behavior. ## Core Features & Use Cases - Accessible Component Library: Install and compose shadcn/ui components (dialogs, forms, tables, navigation, toasts) with built-in Radix UI accessibility, keyboard navigation, and TypeScript type safety. - Utility-First Styling & Theming: Apply Tailwind CSS utilities for layout, spacing, typography, responsive breakpoints, dark mode, and custom design tokens via CSS variables and config generation. - Visual Design System: Create canvas-based visual compositions, posters, and brand materials using a philosophy-driven design approach with bundled open-license fonts. - Use Case: You need a dashboard with a validated login form, responsive card grid, and dark mode toggle. Use this Skill to scaffold shadcn/ui components, wire up react-hook-form with zod validation, and apply Tailwind responsive and dark-mode classes. ## Quick Start Ask the assistant to build a responsive dashboard page using shadcn/ui Card and Button components with Tailwind CSS styling and dark mode support.
