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

# VibeFlow MCP

> Connect any MCP-compatible AI client to VibeFlow and build projects directly from your editor.

The VibeFlow MCP (Model Context Protocol) server lets any MCP-compatible AI client talk directly to VibeFlow. You can scaffold projects, manage design systems, and open projects for editing, all without leaving your editor.

***

## Available tools

### Project tools

| Tool                       | Description                                                                                                                                                    |
| -------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `initiate_project`         | Builds a project from a plain-text prompt. Handles workflows, database, frontend, and auth when needed. Only `prompt` is required; VibeFlow handles the build. |
| `get_project`              | Polls the build status of a project using its `projectId`. Returns one of: `building` · `ready` · `failed`                                                     |
| `open_project_for_editing` | Returns a direct editor URL to open an existing project in VibeFlow for review or editing.                                                                     |
| `export_flow_json`         | Exports a project's flow graph (nodes and edges) as JSON.                                                                                                      |

### Design System tools

| Tool                             | Description                                                                                                            |
| -------------------------------- | ---------------------------------------------------------------------------------------------------------------------- |
| `get_all_design_systems`         | Lists all design systems in your VibeFlow account. Use this before creating a new one or referencing one in a project. |
| `create_design_system`           | Creates a new design system with the specified name, description, and guidelines.                                      |
| `update_design_system`           | Updates an existing design system's name, description, or guidelines.                                                  |
| `add_component_to_design_system` | Adds a reusable component (button, card, form, nav, etc.) to an existing design system.                                |

***

## Typical workflow

```
1. initiate_project  →  kick off a build from a prompt
2. get_project       →  poll until status is "ready"
3. open_project_for_editing  →  get the editor URL to review or modify
```

For design-system-first projects:

```
1. get_all_design_systems          →  pick or confirm a design system
2. create_design_system (if none)  →  generate one from your codebase
3. initiate_project                →  build using the design system
```

***

## Getting your API key

1. Go to **Settings → MCP** in VibeFlow.
2. Click **Create API Key** to generate your key.
3. Copy the **MCP URL** and **API Key**. You'll need both when connecting.

***

## Transport

| Field     | Value                          |
| --------- | ------------------------------ |
| Transport | Streamable HTTP                |
| MCP URL   | `https://tool.vibeflow.ai/mcp` |

Authentication is passed as a bearer token in the `Authorization` header:

```
Authorization: Bearer YOUR_API_KEY
```

Any MCP client that supports HTTP transport with custom headers can connect to VibeFlow.

***

## Connecting your client

### Claude Code

Run the following command in your terminal:

```bash theme={null}
claude mcp add --transport http \
  vibeflow https://tool.vibeflow.ai/mcp \
  --header "Authorization: Bearer YOUR_API_KEY"
```

Replace `YOUR_API_KEY` with the key from your Settings page.

***

### Cursor

Cursor uses `mcp-remote` as a bridge for HTTP-based MCP servers. Add the following to your Cursor MCP config (`~/.cursor/mcp.json` or the MCP settings panel):

```json theme={null}
{
  "vibeflow": {
    "command": "npx",
    "args": [
      "-y",
      "mcp-remote",
      "https://tool.vibeflow.ai/mcp"
    ],
    "env": {
      "HTTP_AUTHORIZATION": "Bearer YOUR_API_KEY"
    }
  }
}
```

Replace `YOUR_API_KEY` with the key from your Settings page.

***

### Other MCP clients

For any other client that supports Streamable HTTP transport, configure it with:

* **MCP URL:** `https://tool.vibeflow.ai/mcp`
* **Auth header:** `Authorization: Bearer YOUR_API_KEY`

Refer to your client's documentation for how to set custom HTTP headers on MCP connections.

***

## Regenerating your API key

Go to **Settings → MCP** and click the regenerate icon next to your API Key. Your old key is immediately invalidated. Update it in your client config after regenerating.