CLI - shadcn-solid

Docs

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.cjs, and CSS variables for the project.

npx shadcn-solid@latest init

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

◆  Which CSS framework would you like to use?
│  ● TailwindCSS
│  ○ UnoCSS
│
◇  Which color would you like to use as base color?
│  Slate
│
◇  Where is your global CSS file?
│  src/app.css
│
◇  Would you like to use CSS variables for colors?
│  Yes
│
◇  Are you using a custom tailwind prefix eg. tw-? (Leave blank if not)
│
│
◇  Where is your tailwind.config.cjs located?
│  tailwind.config.cjs
│
◇  Configure the import alias for components:
│  @/components
│
◇  Configure the import alias for utils:
│  @/libs/cn

Options

Usage: shadcn-solid init [options]

initialize your project and install dependencies

Options:
  -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 shadcn-solid@latest add [component]

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

◆  Which components would you like to add?
│  ◻ accordion (Space to select. A to toggle all. Enter to submit.)
│  ◻ alert
│  ◻ alert-dialog
│  ◻ badge
│  ◻ button
│  ◻ card
│  ◻ checkbox
│  ◻ collapsible
│  ◻ combobox
│  ◻ context-menu
│  ◻ dialog
│  ◻ dropdown-menu
│  ◻ hover-card
│  ◻ image
│  ◻ popover
│  ◻ progress
│  ◻ radio-group
│  ◻ select
│  ◻ separator
│  ◻ sheet
│  ◻ skeleton
│  ◻ switch
│  ◻ table
│  ◻ tabs
│  ◻ textfield
│  ◻ textarea
│  ◻ toast
│  ◻ toggle
│  ◻ tooltip

Options

Usage: shadcn-solid add [options] [components...]

add a component to your project

Arguments:
  components         the components to add

Options:
  -y, --yes          skip confirmation prompt. (default: false)
  -o, --overwrite    overwrite existing files. (default: false)
  -a --all           install all components. (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

Dark mode Typography