> ## Documentation Index
> Fetch the complete documentation index at: https://docs.frontic.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Frontic CLI

The Frontic CLI is a command-line interface for interacting with your [Frontic Account](https://app.frontic.com) and generating project-specific files such as the [Client SDK](/reference/client-sdk).

<Frame>
  <img src="https://mintcdn.com/frontic/34vlQbUxJTTktEkF/images/hero-cli.png?fit=max&auto=format&n=34vlQbUxJTTktEkF&q=85&s=8e37f99a07185ac75ec5a9ce9a08b01c" alt="Frontic CLI Hero" width="1910" height="665" data-path="images/hero-cli.png" />
</Frame>

## Setup

You can use the Frontic CLI in two ways:

1. Install the CLI globally (enables the `frontic` command).
2. Run it ad-hoc through your package manager's runner (`pnpm dlx`, `npx`, `yarn dlx`, `bunx`).

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  # Install once globally
  npm install -g @frontic/cli

  # Then use the `frontic` command
  frontic <command>
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest <command>
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest <command>
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest <command>
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest <command>
  ```
</CodeGroup>

<Accordion title="Which option should I choose?">
  * **Global install** — pin to a specific version, run frequently. You manage upgrades manually.
  * **One-off runner** (`pnpm dlx`, `npx`, etc.) — always uses the latest version (or your package manager's cache). No global state.
</Accordion>

<Accordion title="Video tutorial 🎬">
  <iframe width="640" height="360" src="https://www.loom.com/embed/80e900735a6f4502a04eb02866525735?sid=c37fdabb-be58-4ab9-b6dd-113d657bc5e2" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen />
</Accordion>

## Commands

### `frontic login`

Login to your Frontic account.

In most cases, run this from your project directory (where your `package.json` lives) so the CLI can place generated files correctly.

#### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic login
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest login
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest login
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest login
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest login
  ```
</CodeGroup>

<Info>
  Opens a browser window to complete the login flow. Creates a token in `.frontic-local/`. Add this directory to `.gitignore` to keep credentials out of the repo.
</Info>

#### Options

<ParamField path="--token" type="string">
  An existing Frontic token, for non-interactive use (CI/CD pipelines, headless environments).
</ParamField>

### `frontic logout`

Log out of your Frontic account.

#### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic logout
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest logout
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest logout
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest logout
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest logout
  ```
</CodeGroup>

### `frontic project`

Select the active project for SDK generation and Context Base sync. The selection is stored in `.frontic-local/`.

#### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic project
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest project
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest project
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest project
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest project
  ```
</CodeGroup>

#### Options

<ParamField path="--project, -p" type="string">
  The id of the project to select. If omitted, the CLI prompts you to pick.
</ParamField>

### `frontic generate`

Generate the typed [Client SDK](/reference/client-sdk) for the current project.

#### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic generate
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest generate
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest generate
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest generate
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest generate
  ```
</CodeGroup>

If you work with [multiple environments](/releases/overview), pass `--env` to target a specific one (otherwise the CLI prompts):

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic generate --env develop
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest generate --env develop
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest generate --env develop
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest generate --env develop
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest generate --env develop
  ```
</CodeGroup>

#### Options

<ParamField path="--env, -e" type="develop | preview | public">
  Target environment alias.
</ParamField>

<ParamField path="--output, -o" type="string" default=".frontic">
  Output base directory for generated files.
</ParamField>

<ParamField path="--persist-oas, -s" type="boolean" default="false">
  Persist the OpenAPI specification file alongside the generated client.
</ParamField>

<ParamField path="--verbose, -v" type="boolean" default="false">
  Verbose output and full error messages.
</ParamField>

### `frontic info`

Display the current organization, project, and authenticated user.

#### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic info
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest info
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest info
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest info
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest info
  ```
</CodeGroup>

### `frontic context`

Sync your project's [Context Base](/context-base/overview) (Skills and Rules) into your repository so your editor's AI agent reads them on every session. Three subcommands.

#### `frontic context init`

Sync both Skills and Rules in one shot. By default, targets Claude Code and writes to `.claude/skills/`, `.claude/rules/`, and `.claude/CLAUDE.md`. For Cursor, pass `--agent cursor` and the files go to `.cursor/skills/` and `.cursor/rules/`.

Re-running without `--force` skips unchanged files — safe to run repeatedly.

##### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic context init
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest context init
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest context init
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest context init
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest context init
  ```
</CodeGroup>

##### Options

<ParamField path="--agent" type="claude-code | cursor" default="claude-code">
  Target agent.
</ParamField>

<ParamField path="--output, -o" type="string" default=".">
  Output base directory.
</ParamField>

<ParamField path="--force" type="boolean" default="false">
  Overwrite all files. Without `--force`, unchanged files are skipped.
</ParamField>

#### `frontic context skills`

Sync only Skills.

##### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic context skills
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest context skills
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest context skills
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest context skills
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest context skills
  ```
</CodeGroup>

##### Options

<ParamField path="--agent" type="claude-code | cursor" default="claude-code">
  Target agent.
</ParamField>

<ParamField path="--output, -o" type="string" default=".">
  Output base directory.
</ParamField>

#### `frontic context rules`

Sync only Rules.

##### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic context rules
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest context rules
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest context rules
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest context rules
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest context rules
  ```
</CodeGroup>

##### Options

<ParamField path="--agent" type="claude-code | cursor" default="claude-code">
  Target agent.
</ParamField>

<ParamField path="--output, -o" type="string" default=".">
  Output base directory.
</ParamField>

<ParamField path="--force" type="boolean" default="false">
  Overwrite all files. Without `--force`, unchanged files are skipped.
</ParamField>

### `frontic mcp init`

Initialize Frontic MCP configuration for an AI coding client. Writes the Frontic MCP server entries directly into your client's MCP config file. The command merges with any existing MCP config rather than overwriting it.

When run, the CLI prompts you to choose what to install:

* **Tools & Docs** — both project tools and documentation MCP servers (default).
* **Tools only** — `frontic-tools` (authenticated project access).
* **Docs only** — `frontic-docs` (read-only documentation).

#### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic mcp init --client cursor
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest mcp init --client cursor
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest mcp init --client cursor
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest mcp init --client cursor
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest mcp init --client cursor
  ```
</CodeGroup>

#### Options

<ParamField path="--client" type="cursor | claude | windsurf | vscode | codex" required>
  Target AI coding client. `claude` resolves to Claude Code.
</ParamField>

#### Config file paths

| Client     | Path                                           |
| ---------- | ---------------------------------------------- |
| `cursor`   | `.cursor/mcp.json` (project-local)             |
| `claude`   | `.mcp.json` (project root, for Claude Code)    |
| `windsurf` | `~/.codeium/windsurf/mcp_config.json` (global) |
| `vscode`   | `.vscode/mcp.json` (project-local)             |
| `codex`    | `~/.codex/config.toml` (global, TOML format)   |

See [MCP Tools](/ide/mcp-tools) for a guided walkthrough of the editor setup flow.

### `frontic credentials load`

Pull the project's [Studio credentials](/studio/settings#credentials) into a local `.env` file so the same secrets your Studio workspace uses are available when you run the code on your own machine. The command merges credentials into the file under a delimited block so re-running the command updates only that block — anything else in the file stays put. If a `.gitignore` exists, the env file is added to it automatically.

For Studio workspaces, credentials are injected automatically — `frontic credentials load` is for local development.

#### Usage

<CodeGroup>
  ```bash frontic theme={"theme":"css-variables"}
  frontic credentials load
  ```

  ```bash pnpm theme={"theme":"css-variables"}
  pnpm dlx @frontic/cli@latest credentials load
  ```

  ```bash npm theme={"theme":"css-variables"}
  npx @frontic/cli@latest credentials load
  ```

  ```bash yarn theme={"theme":"css-variables"}
  yarn dlx @frontic/cli@latest credentials load
  ```

  ```bash bun theme={"theme":"css-variables"}
  bunx @frontic/cli@latest credentials load
  ```
</CodeGroup>

#### Options

<ParamField path="--env-file" type="string" default=".env.studio">
  Path (including filename) to the env file the credentials are written to. Created if it doesn't exist.

  The default is `.env.studio` rather than `.env` so the command never overwrites an existing `.env` or `.env.local`. Pass `--env-file` to write to a different filename — for example `--env-file .env.local` if your setup expects everything in one place — or rename the file afterwards.
</ParamField>

<ParamField path="--export" type="boolean" default="false">
  Print `export VAR=value` shell statements to stdout instead of writing a file. Useful for sourcing into the current shell:

  ```bash theme={"theme":"css-variables"}
  eval "$(frontic credentials load --export)"
  ```
</ParamField>

### Getting help

Pass `--help` to any command to see its options:

```bash theme={"theme":"css-variables"}
frontic --help
frontic generate --help
frontic context init --help
```