KymoStudio

    MCP Server

    kymo runs a hosted Model Context Protocol server at mcp.kymo.studio. Connect it to Claude Code, Cursor, Copilot, Codex — even ChatGPT or Claude in your browser — and your coding agent can create and edit your diagrams, rendering live in editor.kymo.studio while the agent types.

    1. Add the server to your agent — one line of config (below).
    2. Ask for a diagram — the agent writes the source and calls the tools.
    3. Watch it draw at editor.kymo.studio — animated SVG, ready to export.

    Connect to the kymo MCP server

    The server speaks two transports: SSE at https://mcp.kymo.studio/sse (recommended where supported) and HTTP at https://mcp.kymo.studio/mcp. Pick your client:

    Claude Code
    Cursor
    VS Code
    Codex
    Gemini CLI
    Windsurf
    Claude.ai
    ChatGPT
    Other
    claude mcp add --transport sse kymo https://mcp.kymo.studio/sse

    Authentication

    The first time your client connects, the server starts an OAuth flow with Google sign-in — no API keys to create or paste. Diagrams are owned by your Google account: every tool call operates only on your own diagrams, and the same account sees them in the editor.

    To disconnect, remove the server from your client's MCP configuration; the session is not used anywhere else.

    Tools

    ToolWhat it doesInputs
    new_diagramCreate a diagram and open it live; returns its id and editor URL.title?, source? (initial DSL), kind?
    list_diagramsList your diagrams (id, title, kind, URL), most-recent first.—
    get_diagramFetch a diagram's source.id? (defaults to most recent)
    edit_diagramReplace the source and/or rename; pushes the change live to any open editor tab.source?, title?, id?, kind?
    delete_diagramPermanently delete a diagram. Cannot be undone.id

    delete_diagram is destructive — if your client supports per-tool confirmation, keep it on.

    Editor control (ui_*)

    Tools prefixed ui_ steer your open editor tab(s) live — they change what the browser shows, not stored content, and report how many live tabs they reached (0 = no editor open right now).

    ToolWhat it doesInputs
    ui_open_diagramOpen a diagram as a tab / switch the editor to it (live navigation).id? (defaults to most recent)
    ui_open_projectSwitch the active project the explorer is scoped to; returns a ?p= editor link.project? (id or name)
    ui_list_open_filesList the diagrams open as tabs in a project, marking the active one.project? (id or name)
    ui_close_fileClose an open diagram tab (does not delete the diagram).id

    Diagram kinds

    new_diagram / edit_diagram accept a kind:

    • kymo (default) — the native .kymo language, rendered as animated SVG by kymo's own engine.
    • Kroki types — mermaid, plantuml, c4plantuml, graphviz, d2, bpmn, dbml, erd, excalidraw, nomnoml, pikchr, structurizr, svgbob, tikz, vega, vegalite, wavedrom, wireviz, and more — previewed in the editor via kroki.io.

    For the Mermaid syntax kymo understands natively, see Flowchart and Sequence Diagram.

    Try it

    With the server connected, ask your agent something like:

    Draw the request flow of this repo as a flowchart on kymo —
client → API → queue → worker → database, with a retry loop.

    The agent calls new_diagram, replies with an editor.kymo.studio link, and every follow-up (“make the queue a cylinder”, “add a cache”) lands as an edit_diagram you watch happen live.

    See also