# Rokkit CLI > Command-line tools for setting up and validating Rokkit projects Package: `@rokkit/cli` ## Usage Run without installing: ```bash npx @rokkit/cli@latest ``` Or install globally: ```bash npm install -g @rokkit/cli rokkit ``` ## rokkit init / rokkit add Interactive setup for an existing SvelteKit project. `rokkit add` is an alias. Run from the project root. ```bash npx @rokkit/cli@latest init npx @rokkit/cli@latest add # same as init ``` ### Flow 1. Detects SvelteKit project (checks for `svelte.config.js`) 2. Installs `@rokkit/ui`, `@rokkit/unocss`, `@rokkit/themes`, `@rokkit/icons` via detected package manager 3. Runs interactive prompts (see below) 4. Writes config files ### Prompts | Prompt | Type | Description | Choices | |--------|------|-------------|---------| | `palette` | select | Color palette preset | `default` (orange/pink/sky), `vibrant` (blue/purple/sky), `seaweed` (sky/green/blue), `custom` | | `primary` | text | Primary color (Tailwind name) | Default: `orange`. **Conditional:** only when `palette` is `custom` | | `secondary` | text | Secondary color | Default: `pink`. **Conditional:** only when `palette` is `custom` | | `accent` | text | Accent color | Default: `sky`. **Conditional:** only when `palette` is `custom` | | `surface` | text | Surface color | Default: `slate`. **Conditional:** only when `palette` is `custom` | | `iconStyle` | select | Icon style variant | `Default (duotone)`, `Solid`, `Outline`, `Duotone outline` | | `icons` | select | Icon collections | `rokkit` (Rokkit icons only), `custom` (Rokkit + custom collection) | | `iconPath` | text | Path to custom icon collection JSON | Default: `./static/icons/custom.json`. **Conditional:** only when `icons` is `custom` | | `themes` | multiselect | Theme styles | `rokkit` (default), `minimal`, `material`, `frosted`, `grada-ui`, `shadcn`, `daisy-ui`, `bits-ui`, `carbon`, `ant-design` | | `defaultTheme` | select | Default theme style | **Conditional:** only when multiple themes selected | | `switcher` | select | Theme switching mode | `system` (prefers-color-scheme), `manual` (light/dark toggle), `full` (light/dark + style variants) | | `includeChart` | confirm | Include chart configuration? | Default: `true` | | `chartColors` | select | Chart color set | `default` (14 colors), `warm` (8 colors), `cool` (8 colors). **Conditional:** only when chart included | | `chartShades` | select | Chart shade contrast | `standard`, `high`, `soft`. **Conditional:** only when chart included | ### Files Written | File | Notes | |------|-------| | `rokkit.config.js` | Colors, themes, switcher, storageKey, icons (with style), optional chart config. Skipped if exists. | | `uno.config.js` | Written with `presetRokkit()` from `@rokkit/unocss`. Skipped if exists. | | `src/app.css` | Prepends missing `@import` lines for `@unocss/reset/tailwind.css`, `@rokkit/themes/base.css`, and each selected theme. Creates if missing. | | `src/app.html` | Injects flash-prevention `