New Flowchart AI is now an MCP server

Your agent draws. You iterate.

Ask Claude, ChatGPT, Copilot, Cursor or OpenCode for a flowchart and get back a link to a real, editable chart. Change it in the browser while your agent keeps editing the same chart. Each of you sees the other’s changes within seconds.

MCP server URL

https://flowchart.zeroclickdev.ai/api/mcp

Streamable HTTP, no sign-in. Setup for your client

Sound on. A prompt becomes a chart. Then an agent creates one over MCP and updates it while it’s open in the browser.

How it works

  1. Connect your agent

    Add the server URL to your AI client once. There’s nothing to sign up for and no key to paste.

  2. Ask for a chart

    “Draw our signup → payment → onboarding flow.” Your agent calls create_flowchart, the server lays the chart out, and you get a link to open it.

  3. Iterate together

    Drag, rename or add steps in the browser; your edits save automatically. Ask your agent for a change and it calls update_flowchart. Your open tab shows it within seconds, marked Updated by AI agent.

Set up your client

Pick your client. Any other MCP client that supports Streamable HTTP works with the same URL.

Claude (web and desktop)

  1. Open Customize → Connectors, click +, then Add custom connector.
  2. Name it Flowchart AI and paste the server URL. Leave Advanced settings empty; there’s nothing to sign in to.
  3. Click Add. In a chat, turn it on from + → Connectors.
Server URL
https://flowchart.zeroclickdev.ai/api/mcp

Custom connectors work on the Free plan (one connector), Pro and Max. On Team and Enterprise, an Owner adds the connector first under Organization settings → Connectors; members then connect it from Customize → Connectors.

Claude Code

Run this in your terminal:

Terminal
claude mcp add --transport http flowchart https://flowchart.zeroclickdev.ai/api/mcp

Add --scope user to use it in every project. Run /mcp inside Claude Code to check the connection.

ChatGPT (web, developer mode)

  1. In ChatGPT, open Settings → Security and login and turn on Developer mode.
  2. Go to chatgpt.com/plugins and click +. Name it Flowchart AI, paste the server URL as the connection, choose No authentication, and create it.
  3. In a chat, choose Developer mode from the + menu and select Flowchart AI. ChatGPT asks you to confirm before it creates or changes a chart.
Server URL
https://flowchart.zeroclickdev.ai/api/mcp

Developer mode is available on the web for Plus, Pro, Business, Enterprise and Edu accounts; in a workspace, an admin may need to allow it. Menu names change often, so look for “Developer mode” if these don’t match.

VS Code (GitHub Copilot)

Run MCP: Add Server from the Command Palette, choose HTTP, paste the server URL, and save it to .mcp.json (this workspace) or Copilot Global (every workspace). Or add it to .mcp.json at the root of your workspace:

.mcp.json
{
  "mcpServers": {
    "flowchart": {
      "type": "http",
      "url": "https://flowchart.zeroclickdev.ai/api/mcp"
    }
  }
}

Or add it to your VS Code user profile from a terminal:

Terminal (macOS, Linux)
code --add-mcp '{"name":"flowchart","type":"http","url":"https://flowchart.zeroclickdev.ai/api/mcp"}'

Cursor

Add to Cursor

Or add it to ~/.cursor/mcp.json for all projects, or .cursor/mcp.json for one:

~/.cursor/mcp.json
{
  "mcpServers": {
    "flowchart": {
      "url": "https://flowchart.zeroclickdev.ai/api/mcp"
    }
  }
}

OpenCode

Run this in your project (add --global to use it in every project):

Terminal
opencode mcp add flowchart --url https://flowchart.zeroclickdev.ai/api/mcp

Or add it to opencode.json yourself:

opencode.json
{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "servers": {
      "flowchart": {
        "type": "remote",
        "url": "https://flowchart.zeroclickdev.ai/api/mcp"
      }
    }
  }
}

On OpenCode 1.x, run opencode mcp add and follow the prompts, or put "flowchart": { "type": "remote", "url": "https://flowchart.zeroclickdev.ai/api/mcp" } directly under "mcp".

Five tools

Your agent finds these on its own. The server also gives it an authoring guide and a JSON schema, and invalid input comes back with a list of exact fixes.

create_flowchart
Creates a chart from nodes and edges, lays it out, and returns a view link and an edit link.
get_flowchart
Reads the latest version of a chart, including your edits in the browser.
update_flowchart
Adds, changes or removes nodes and edges in place, and checks the version it last read so it doesn’t overwrite your newer edits.
list_node_types
Lists the node types, containers, edge styles and limits an agent can use.
search_azure_icons
Finds official Azure service icons by name or alias, like “cosmos” or “aks”.

Questions

More detail in the MCP docs.

Is it free? Do I need an account?

It’s free, and there’s no account, sign-up or API key. Access to each chart comes from its link instead.

Who can see my chart?

Anyone with its view link (/f/<id>) can see it. The edit link adds #edit=… and lets whoever has it, including your agent, change the chart, so share it only with people and agents you trust. Chart ids are random and can’t practically be guessed, but don’t put passwords or keys in a chart.

Does Flowchart AI use AI on its side?

No. The MCP server never calls a language model. Your own agent writes the chart; the server only checks it, lays it out and stores it. (The prompt box in the app is separate and uses Azure OpenAI.)

What are the limits?

A chart can have up to 500 nodes and 1,000 edges (256 KB). Agents can create up to 300 charts and make 1,200 updates an hour from one network, and a daily budget shared by everyone keeps the free service from being overrun. See the full list.

Can I host it myself?

Yes. The code is MIT-licensed. Deploy it to Vercel with Upstash Redis for storage, or run npm run dev to serve the app and /api/mcp locally. See self-hosting.