shadcn-skill-cli

Build beautiful UIs in minutes — not hours.

This CLI asks you a few questions about what you're building, then sets up shadcn/ui with the right components and templates automatically.

Quick Start

npx shadcn-skill-cli@latest init

Answer a few questions, and you'll have a complete, production-ready UI project ready to run.

What It Does

1. Asks what you're building (app type, pages, features)
2. Installs shadcn/ui with the exact components you need
3. Generates layouts and page templates using best practices

No more wondering which components to pick or how to structure your UI.

Supported Frameworks

• Next.js (App Router + TypeScript)
• Vite (React + TypeScript)

Supported Styles

Choose a visual style that matches your brand:

| Style | Feel | Best for | |-------|------|----------| | Nova | Clean, professional | Most projects | | Vega | Modern, bold | Startups, tech | | Maia | Warm, friendly | Consumer apps | | Mira | Elegant, minimal | Portfolios, creative | | Lyra | Technical, sharp | Dev tools, data | | Luma | Bright, modern | SaaS, cloud |

Available Pages

Each page template is production-ready — just customize the data.

• Dashboard — Stats cards, activity feed, quick actions
• Data Table — Search, sort, pagination, row actions (CRUD)
• Form — Complex forms with validation, multi-step support
• Settings — Tabs layout for account, appearance, notifications, security
• Analytics — KPI cards, charts, conversion funnel
• User Management — User list with roles, status, actions
• Auth (Login / Register / Forgot) — Ready-to-use auth pages
• Notification Center — In-app notifications UI
• File Upload — File manager with drag & drop
• Documentation — Docs page with sidebar navigation
• Landing — Hero section, features, CTA

Features

Add features alongside your pages:

• Sidebar Navigation — Collapsible admin sidebar
• Dark / Light Mode — Theme toggle with system support
• Command Palette — ⌘K search across your app
• Responsive Mobile Nav — Sheet-based mobile menu
• i18n — Multi-language setup
• RBAC — Role-based access control UI patterns
• Export — PDF/CSV export dialogs
• Wizard Form — Multi-step form flows

Command Reference

init

# Interactive wizard
npx shadcn-skill-cli@latest init

# Skip the wizard with flags
npx shadcn-skill-cli@latest init \
  --type dashboard \
  --framework next \
  --style nova \
  --name "My App"

add:page

# Add a page to an existing project
npx shadcn-skill-cli@latest add:page analytics

doctor

# Check if your project is set up correctly
npx shadcn-skill-cli@latest doctor

list

# See all available pages, components, features
npx shadcn-skill-cli@latest list

After Init

cd your-project
pnpm install
pnpm dev

Your project opens at http://localhost:3000 (Next.js) or http://localhost:5173 (Vite).

Requirements

• Node.js 18 or higher
• npm, pnpm, bun, or yarn

Uninstall

npm uninstall -g shadcn-skill-cli

License

MIT