Skip to content
Drivn logoDrivn

CLI

The Drivn CLI installs component source code directly into your project.

create

Use the create command to initialize Drivn in your project.

1npx drivn@latest create
1# 1. Detects framework and TypeScript
2# 2. Prompts for component and utility paths
3# 3. Creates src/components/ui/ directory
4# 4. Creates src/utils/cn.ts utility
5# 5. Generates globals.css with base color tokens
6# 6. Installs clsx, tailwind-merge, lucide-react
7# 7. Creates drivn.config.json

add

Use the add command to install components. Dependencies are auto-resolved.

1npx drivn add button
1npx drivn add button card input dialog
1# Run without arguments for interactive selection
2npx drivn add

add theme

Add dark/light theme support. Theming is optional — not included in create by default.

1npx drivn add theme
1# 1. Creates theme-provider.tsx in your components directory
2# 2. Appends dark/light theme tokens to your globals file
3# 3. Installs next-themes
4# 4. Shows setup steps for ThemeProvider

See the Theming page for the full setup guide.

Configuration

The CLI stores configuration in drivn.config.json at your project root.

1{
2 "framework": "next",
3 "typescript": true,
4 "paths": {
5 "components": "src/components/ui",
6 "utils": "src/utils",
7 "globals": "src/styles/globals.css"
8 },
9 "installed": []
10}

Package Managers

Drivn works with npm and pnpm.

1# npm
2npx drivn@latest create
3npx drivn add button
4
5# pnpm
6pnpm dlx drivn@latest create
7pnpm dlx drivn add button