# Use AI agents on board files

> Connect Claude Code, Cursor or VS Code to the MCP server built into the desktop app, and let your AI agent draw diagrams, charts and wireframes on the board file you have open.

Source: https://mockflow.com/docs/ai-agents-desktop-app

The desktop app includes an MCP server, a standard connection that AI coding tools use to work with other apps. It starts with the app and runs only on your computer, so your AI agent can add flowcharts, mind maps, charts, kanban boards, tables and more to the board file you have open, without the board leaving your machine.

![Claude Code drawing a cloud architecture diagram and a sprint kanban on the open board file Payments service.board, which is then saved](https://assets.mockflow.com/docs/media/d9a33025b5344e219343a2cbff820fc2.webp)

## Connect your AI tool

The server's address is `http://localhost:21193/mcp`. Add it to your tool once:

**Claude Code**: run this command in a terminal.

```bash
claude mcp add --transport http -s user mockflow http://localhost:21193/mcp
```

**Cursor**: open **Settings** > **Cursor Settings** > **Tools & MCP** and add:

```json
{
  "mcpServers": {
    "mockflow": {
      "url": "http://localhost:21193/mcp"
    }
  }
}
```

**VS Code**: create `.vscode/mcp.json` in your project with:

```json
{
  "servers": {
    "mockflow": {
      "type": "http",
      "url": "http://localhost:21193/mcp"
    }
  }
}
```

## Draw on a board file

1. Open the MockFlow desktop app and open or create a board file.
2. In your AI tool, ask for what you need, for example "Draw a flowchart of our support ticket process on my MockFlow board" or "Add a pie chart of tickets by channel".
3. The result appears on the open board. Review it, then press Ctrl+S (⌘S on Mac) to save it into the file.

Keep one board open while your agent works, so its results land on the board you expect.

## Wireframe files

A second server for Classic WireframePro runs at `http://localhost:21194/mcp`. Add it the same way, named for example `mockflow-wireframepro`, to have your agent design screens in an open `.wire` file.

To bring your own AI to cloud boards and to Mida, see [What is Bring your own AI?](/docs/what-is-bring-your-own-ai).
