GitHub
Docs
CLI

CLI

Use the CLI to add components to your project.

init

Use the init command to initialize configuration and dependencies for a new project.

The init command installs dependencies, adds the cn util, configures tailwind.config.js, and CSS variables for the project. 

npx shadcn-ng@latest init
npm
yarn
pnpm
bun

You will be asked a few questions to configure components.json: 

◇  Verifying framework. Found Angular
│
◇  Which color would you like to use as the base color?
│  Zinc
│
◆  Would you like to use CSS variables for theming?
│  ● Yes / ○ No

Options 

Usage: shadcn-ng init [options] [components...]
 
initialize your project and install dependencies
 
Arguments:
  components       the components to add or a url to the component.
 
Options:
  -c, --cwd <cwd>  the working directory. defaults to the current directory.
  -f, --force      force overwrite of existing configuration. (default: false)
  -d, --defaults,  use default configuration. (default: false)
  -y, --yes        skip confirmation prompt. (default: true)
  -h, --help       display help for command

add

Use the add command to add components and dependencies to your project. 

npx shadcn-ng@latest add [component]
npm
yarn
pnpm
bun

You will be presented with a list of components to choose from: 

Which components would you like to add? › Space to select. A to toggle all.
Enter to submit.
 
◯  accordion
◯  alert
◯  alert-dialog
◯  aspect-ratio
◯  avatar
◯  badge
◯  button
◯  calendar
◯  card
◯  checkbox

Options 

Usage: shadcn-ng add [options] [components...]
 
add a component to your project
 
Arguments:
  components         the components to add or a url to the component.
 
Options:
  -y, --yes          skip confirmation prompt. (default: false)
  -o, --overwrite    overwrite existing files. (default: false)
  -c, --cwd <cwd>    the working directory. defaults to the current directory.
  -a, --all          add all available components (default: false)
  -p, --path <path>  the path to add the component to.
  -h, --help         display help for command

build

Use the build command to generate the registry JSON files. 

npx shadcn-ng@latest build
npm
yarn
pnpm
bun

This command reads the registry.json file and generates the registry JSON files in the public/r directory. 

Usage: shadcn-ng build [options] [registry]
 
build components for a shadcn registry
 
Arguments:
  registry             path to registry.json file (default: "./registry.json")
 
Options:
  -o, --output <path>  destination directory for json files (default: "./public/r")
  -c, --cwd <cwd>      the working directory. defaults to the current directory.
  -h, --help           display help for command

To customize the output directory, use the --output option. 

npx shadcn-ng@latest build --output ./public/registry
npm
yarn
pnpm
bun
Theming Typography