Docs
CLI
CLI
Use the CLI to add components to your project.
Note: We just released a new shadcn
CLI. See the changelog for more information.
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 @token-kit/cli@latest init
You will be asked a few questions to configure components.json
:
Which style would you like to use? › New York
Which color would you like to use as base color? › Zinc
Do you want to use CSS variables for colors? › no / yes
Options
Usage: shadcn init [options] [components...]
initialize your project and install dependencies
Arguments:
components the components to add or a url to the component.
Options:
-d, --defaults use default values i.e default, zinc and css variables. (default: false)
-f, --force force overwrite of existing components.json. (default: false)
-y, --yes skip confirmation prompt. (default: false)
-c, --cwd <cwd> the working directory. defaults to the current directory.
-h, --help display help for command
add
Use the add
command to add components and dependencies to your project.
npx @token-kit/cli@latest add [component]
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 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.
-p, --path <path> the path to add the component to.
-h, --help display help for command
Monorepo
In a monorepo, you can specify the path to your workspace with the -c
or --cwd
option.
npx @token-kit/cli@latest init -c ./apps/www
or
npx @token-kit/cli@latest add alert-dialog -c ./apps/www