CLI

Use the createui CLI to add Create UI components to your project.

The createui CLI installs Create UI components into your project as plain source files. It reads your components.json, fetches items from the @createui registry, installs their npm dependencies, and writes the component files under your configured aliases. Once the code lands in your project you own it: edit it like any other file.

The CLI is published as @create-ui/cli. Run it with npx:

pnpm dlx @create-ui/cli <command>

All components come from the built-in @createui registry. There is nothing to configure. Items are always referenced by bare name (add button); the @createui name is only used as the registry argument to search and list.

A typical session looks like this:

pnpm dlx @create-ui/cli init                        # one-time setup
npx @create-ui/cli search @createui -q "date"  # find a component
npx @create-ui/cli view date-input             # inspect it before adding
npx @create-ui/cli add date-input              # add it to your project

Commands

Command	What it does
`init`	Set up Create UI in an existing project
`create`	Scaffold a new project with Create UI
`add`	Add components to your project
`view`	Inspect registry items before adding them
`search`	Search or list the registry
`diff`	Check installed components for upstream updates
`migrate`	Run codebase migrations
`info`	Print your project configuration
`skill`	Install the agent skill for AI coding agents
`mcp`	Run or configure the MCP server

init

Use init to set up Create UI in an existing project. It detects your framework, writes components.json, installs dependencies, adds the cn utility, and writes the theme tokens as CSS variables into your global CSS file.

pnpm dlx @create-ui/cli init

The command asks for your theme choices interactively. Pass the flags to skip the prompts:

pnpm dlx @create-ui/cli init --theme blue --neutral slate --font-variant v1

You can also install components in the same step:

pnpm dlx @create-ui/cli init button select

Themes

A theme is a swappable token set layered on the single Create UI system. You pick two: a primary theme for the accent palette and a neutral theme for backgrounds, text, and borders.

Primary themes: indigo (default), blue, lime, green, red, orange, yellow, cyan
Neutral themes: gray (default), slate, zinc, base, stone
Font variants: v1 (Geist + JetBrains Mono)

To change the theme later, re-run init with new flags or edit the token variables in your global CSS.

Options

Option	Description	Default
`[components...]`	Components to install in the same step (name, URL, or local path)	-
`-t, --template <name>`	Template: `next`, `start`, `vite`, `next-monorepo`	-
`--theme <theme>`	Primary color theme (see list above)	-
`--neutral <neutral>`	Neutral color theme (see list above)	-
`--font-variant <name>`	Font variant: `v1`	-
`-b, --base-color <c>`	Deprecated: use `--theme` instead	-
`-y, --yes`	Skip the confirmation prompt	`true`
`-d, --defaults`	Use the default configuration	`false`
`-f, --force`	Overwrite an existing configuration	`false`
`-c, --cwd <cwd>`	The working directory	current
`-s, --silent`	Mute output	`false`
`--src-dir`	Use the `src` directory	`false`
`--no-src-dir`	Do not use the `src` directory	-
`--css-variables`	Use CSS variables for theming	`true`
`--no-css-variables`	Do not use CSS variables for theming	-
`--no-base-style`	Do not install the base Create UI style	-

create

Use create to scaffold a brand-new project with Create UI already configured. It prompts for a project name, a template, and your theme choices, then sets everything up.

pnpm dlx @create-ui/cli create my-app --template next

Available templates:

Template	Framework
`next`	Next.js
`vite`	Vite
`start`	TanStack Start

To start from a preset configuration instead of answering the theme prompts, pass --preset. Use it bare to pick from a list, or pass a preset name or URL directly:

pnpm dlx @create-ui/cli create my-app --preset
npx @create-ui/cli create my-app --preset <name>

create scaffolds a new project. To set up Create UI inside a project that already exists, use init.

Options

Option	Description	Default
`[name]`	The name of your project	-
`-t, --template <name>`	Template: `next`, `vite`, `start`	-
`-p, --preset [name]`	Use a preset configuration	-
`-c, --cwd <cwd>`	The working directory	current
`--src-dir`	Use the `src` directory	`false`
`--no-src-dir`	Do not use the `src` directory	-
`-y, --yes`	Skip the confirmation prompt	`true`

add

Use add to add components and their dependencies to your project. It accepts bare names, URLs, and local paths.

pnpm dlx @create-ui/cli add button

Add several at once:

pnpm dlx @create-ui/cli add button select toast

If a component depends on other registry items (for example, a form control that builds on field), those are added automatically. To replace files you have edited locally, pass --overwrite:

pnpm dlx @create-ui/cli add button --overwrite

To find out whether installed components are out of date before overwriting anything, use diff.

Options

Option	Description	Default
`[components...]`	Component name, URL, or local path	-
`-y, --yes`	Skip the confirmation prompt	`false`
`-o, --overwrite`	Overwrite existing files	`false`
`-a, --all`	Add all available components	`false`
`-p, --path <path>`	The path to add the component to	-
`-c, --cwd <cwd>`	The working directory	current
`-s, --silent`	Mute output	`false`
`--src-dir`	Use the `src` directory	`false`
`--no-src-dir`	Do not use the `src` directory	-
`--css-variables`	Use CSS variables for theming	`true`
`--no-css-variables`	Do not use CSS variables for theming	-

view

Use view to inspect items before adding them. It prints each item's metadata and file contents as JSON, so you can see exactly what add would write into your project.

pnpm dlx @create-ui/cli view button

You can view multiple items at once:

pnpm dlx @create-ui/cli view button select toast

Options

Option	Description	Default
`<items...>`	The item names or URLs to view	-
`-c, --cwd <cwd>`	The working directory	current

search

Use search to find items in the registry. The registry name must be prefixed with @.

pnpm dlx @create-ui/cli search @createui -q "input"

Without a query, it lists everything. list is an alias for search, so these are equivalent:

pnpm dlx @create-ui/cli search @createui
npx @create-ui/cli list @createui

Use --limit and --offset to page through long result lists.

Options

Option	Description	Default
`<registries...>`	Registry to search, prefixed with `@`	-
`-q, --query <query>`	Search query	-
`-l, --limit <n>`	Maximum number of items per registry	`100`
`-o, --offset <n>`	Number of items to skip	`0`
`-c, --cwd <cwd>`	The working directory	current

diff

Use diff to check installed components against the registry. Without an argument, it lists the components that have updates available:

pnpm dlx @create-ui/cli diff

With a component name, it shows what changed upstream:

pnpm dlx @create-ui/cli diff button

Review the diff, then decide per component: if you have no local edits, re-add it with add <name> --overwrite; if you do, apply the upstream changes by hand so your edits survive.

Options

Option	Description	Default
`[component]`	The component name	-
`-y, --yes`	Skip the confirmation prompt	`false`
`-c, --cwd <cwd>`	The working directory	current

migrate

Use migrate to run a codebase migration. List the available migrations first:

pnpm dlx @create-ui/cli migrate --list

Migration	What it does
`icons`	Migrate your UI components to a different icon library
`radix`	Migrate to `radix-ui`, consolidating `@radix-ui/react-*` imports

pnpm dlx @create-ui/cli migrate radix

Options

Option	Description	Default
`[migration]`	The migration to run	-
`-l, --list`	List all migrations	`false`
`-y, --yes`	Skip the confirmation prompt	`false`
`-c, --cwd <cwd>`	The working directory	current

info

Use info to print information about your project: the detected framework, the resolved aliases and paths, and the contents of your components.json. Run it when you need to know where components live, which global CSS file holds the tokens, or how imports should be written.

pnpm dlx @create-ui/cli info

Options

Option	Description	Default
`-c, --cwd <cwd>`	The working directory	current

skill

Use skill to install the Create UI agent skill, a bundled guide that teaches AI coding agents how to write correct Create UI code.

pnpm dlx @create-ui/cli skill

By default it installs for Claude Code in your home directory. Use --client for other agents (claude, gemini, codex, agents), --project to install into the current project instead, or --path for an explicit skills directory.

See the Agent Skill page for the full setup guide.

Options

Option	Description	Default
`--client <client>`	The agent to install for: `claude`, `gemini`, `codex`, `agents`	`claude`
`--project`	Install into the project instead of your home directory	`false`
`-p, --path <path>`	Install into an explicit skills directory (for other agents)	-
`-f, --force`	Overwrite an existing skill installation	`false`
`-y, --yes`	Skip the overwrite confirmation prompt	`false`
`-c, --cwd <cwd>`	The working directory	current

mcp

Use mcp to run the Create UI MCP server, which lets AI assistants browse, search, and install components from the registry. Running the command starts the stdio server:

pnpm dlx @create-ui/cli mcp

You rarely run that yourself. Instead, write the configuration for your MCP client with mcp init:

pnpm dlx @create-ui/cli mcp init --client claude

Supported clients: claude, cursor, vscode, codex, opencode.

See the MCP Server page for client-by-client setup and example prompts.

Options

Option	Description	Default
`-c, --cwd <cwd>`	The working directory	current
`init --client <client>`	MCP client: `claude`, `cursor`, `vscode`, `codex`, `opencode`	-