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

# Connect AI (MCP)

> Connect a BenchCanvas project to Claude Code, Cursor, Codex, or any MCP client so your AI can read screenshots, frames, URLs, comments, and notes.

BenchCanvas MCP lets you point an AI agent at a project so it can see the same context you organized on the canvas: screenshots, frames, URLs, comments, and sticky notes. Capture and annotate first, then connect your tool when you are ready to design or build.

MCP is read-only. Your AI can inspect what you share. It cannot edit the canvas.

## How it works

<Steps>
  <Step title="Capture and organize">
    Capture references, inspiration, and competitors. Add [comments](/collaborate/comments) and [sticky notes](/collaborate/sticky-notes), and share with your team for feedback if you want.
  </Step>

  <Step title="Open Connect AI">
    In the project top bar, next to Share, open **Connect AI**. BenchCanvas generates a share link for the project and shows setup instructions for your tool.
  </Step>

  <Step title="Connect your AI tool">
    Follow the steps for Claude Code, Cursor, or another MCP-compatible client. Paste the project share link so the AI reads the right canvas.
  </Step>

  <Step title="Ask while you build">
    In your AI tool, ask about the project. For example: remind me of the notes I left about this competitor, or design a component like this reference I saved.
  </Step>
</Steps>

## Supported tools

| Tool                  | How to connect                                                                                               |
| --------------------- | ------------------------------------------------------------------------------------------------------------ |
| **Claude Code**       | Run the `claude mcp add` command shown in Connect AI                                                         |
| **Cursor**            | Add the BenchCanvas MCP server URL to your MCP config (`mcp.json`)                                           |
| **Other MCP clients** | Paste the same HTTP endpoint into any MCP-compatible tool (Windsurf, Cline, VS Code, Zed, Codex, and others) |

## What the AI can see

Once connected and pointed at a project share link, the AI can read:

* Screens and screenshots
* Frames and flow structure
* Screen URLs and titles
* Comments
* Sticky notes

It only sees projects you share through a public share link. See [Share links](/share/share-links).

<Tip>
  If a screenshot includes personal data, [hide sensitive info](/canvas/hide-sensitive-info) before you share the project with an AI tool or a teammate.
</Tip>

## Learn more

For a product overview, see [benchcanvas.app/mcp](https://benchcanvas.app/mcp).
