CLI Quickstart

Command Line Interface (CLI) to manage and configure your project efficiently.

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

npx shadcn@latest init

This installs dependencies, sets up the cn utility, configures tailwind.config.js, and generates a components.json file.

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 for init

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 new-york, 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
 

Use the add command to add new components and their dependencies:

npx shadcn@latest add [component]

Options for add

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

To specify a workspace path in a monorepo, use -c or --cwd:

npx shadcn@latest init -c ./apps/www

or

npx shadcn@latest add alert-dialog -c ./apps/www

You can install ScrollX UI components through the CLI. Use the following command structure:

npx shadcn@latest add https://scrollxui.dev/registry/[component].json

Integrates a new component into your project.

npx shadcn@latest add https://scrollxui.dev/registry/alert-dialog.json

Shadcn CLI 3.0

You can now have namespaced registries with ShadCN CLI 3.0.

Edit components.json file

{
  "registries": {
    "@scrollxui": "https://www.scrollxui.dev/registry/{name}.json"
  }
}

To install any component, use the following command:

npx shadcn@latest add @scrollxui/[component]

Example:

npx shadcn@latest add @scrollxui/profilecard

You can search, view, and discover components from registries before installing them.

View

View items from the registry before installing:

npx shadcn@latest view @scrollxui

Search

Search items from registries:

npx shadcn@latest search @scrollxui -q "profilecard"

List

List all items from a registry:

npx shadcn@latest list @scrollxui

Preview components before installing them. Search across multiple registries. See the code and all dependencies upfront.

MCP Server

The shadcn MCP Server allows AI assistants to interact with items from registries. You can browse available components, search for specific ones, and install them directly into your project using natural language.

Add the ScrollX UI registry to your project's components.json file.

{
  "registries": {
    "@scrollxui": "https://www.scrollxui.dev/registry/{name}.json"
  }
}

For example, you can ask an AI assistant to "Build a landing page using components from the ScrollX UI registry" or "Find me a login form from the ScrollX UI registry".

Add the MCP server to your project:

npx shadcn@latest mcp init

Registries are configured in your project's components.json file.

Configure for AI Assistants

Select the AI assistant you want to integrate with your project. Each tab provides the commands to configure that assistant client quickly and correctly using the ShadCN CLI.

npx shadcn@latest mcp init --client cursor

Select the package manager that corresponds to your development environment to configure the AI assistant client using the ShadCN CLI. Each option provides the correct command syntax to set up the assistant quickly and seamlessly.