Loading…
Loading…
Connect Claude Code, Cursor, Claude Desktop, VS Code or Codex to koboyo, and your coding assistant can draw diagrams, build slide decks, sketch and edit freely on your canvases, and manage them for you. The MCP server is part of Koboyo Pro. It all runs through one Model Context Protocol server.
What you get back is a real canvas, not a picture of one. All 20 of koboyo's diagram kinds work here: architecture, flowcharts, sequence, ERD, state machines, mind maps, gantt, sankey, git graphs, charts, wireframes, timelines, journeys, cycles, funnels, pyramids, venn, matrix, BPMN and org charts. Each one becomes a frame you can open and edit. Every result also gives your assistant a link to the canvas, embed URLs for light and dark mode you can drop into a README, and a picture of the diagram so you can see it right away in the chat.
First get your key. Go to koboyo.com, open MCP server in the sidebar, and
create one. You can also get it from the "Use with AI" button in the icon library.
You only see the key once, right after you create it, so copy it before you leave
the page.
Then add the server to whichever client you use. In each snippet below, replace
kbi_YOUR_KEY with the key you just copied.
Claude Code
claude mcp add --scope user --transport http koboyo https://api.koboyo.com/v1-mcp --header "Authorization: Bearer kbi_YOUR_KEY"
--scope user makes Koboyo available in every project, not only the folder you ran
the command in.
Cursor and Claude Desktop. Add this to the client's mcp.json:
{
"mcpServers": {
"koboyo": {
"type": "streamable-http",
"url": "https://api.koboyo.com/v1-mcp",
"headers": { "Authorization": "Bearer kbi_YOUR_KEY" }
}
}
}
VS Code
code --add-mcp '{"name":"koboyo","type":"http","url":"https://api.koboyo.com/v1-mcp","headers":{"Authorization":"Bearer kbi_YOUR_KEY"}}'
Codex. Codex cannot send custom headers, so it puts the key in the URL instead. URLs can end up in server logs, so use the header version above if your client supports it.
codex mcp add koboyo --url "https://api.koboyo.com/v1-mcp?key=kbi_YOUR_KEY"
Once it is connected, just ask. "Draw me an architecture diagram of this repo" or "turn these notes into a slide deck" is enough.
Slides can build themselves up while you present, too: ask for a deck "where the bullets appear one at a time" and each of those slides reveals its contents a click at a time. You can reorder the steps by hand afterwards in the app, under Animate on any slide.
| tool | what it does |
|---|---|
whoami | Your account and every workspace it can write to, with board names, ids and how many diagrams each board has room for |
get_syntax | The cheatsheet for one diagram kind, with examples that work and tips for making it look good |
preview_diagram | Draws diagram code and shows the picture without saving it, so your assistant can try a draft first |
create_diagram | Turns diagram code into a frame on a canvas. Returns the edit link, embed URLs and a picture of the diagram |
update_diagram | Redraws an existing frame from new code. It keeps the same id, so embeds you have already shared keep working |
get_diagram | Reads back a frame's code, and tells you whether someone has edited the drawing by hand since |
list_canvases | Every board in a workspace, with its diagrams and their ids |
create_canvas | Makes a new empty board, optionally filed in a folder like Clients/Acme |
delete_canvas | Moves a board and everything on it to the Trash |
create_slides | Starts a slide deck |
add_slide | Adds one more slide to a deck you already have |
Your assistant can also work on a board directly, with the same tools koboyo's built-in assistant uses. It can read what is on a board, look at it as a picture, and then add, change, arrange or remove things. Every change comes back with a picture of the result, so it can check its work and fix anything that looks off.
| tool | what it does |
|---|---|
read_canvas | Lists a board's frames and shapes, with the ids the other tools use |
look_at_canvas | A picture of a frame, some shapes or the whole board, plus a check for overlaps |
find_shape | Finds shapes by their text or kind |
find_icon | Looks up icons for shapes and diagrams, like tech:redis or aws:lambda |
draw_shapes | Draws boxes, icons, text and sticky notes with arrows between them |
update_shapes | Changes the colour, label, icon or shape of existing shapes |
restyle | Changes the style of a whole set of shapes at once |
connect_shapes | Draws arrows between existing shapes |
tidy_diagram | Lays a diagram out again cleanly |
move_shapes | Moves shapes, and arrange_shapes, space_shapes, reflow_shapes line them up |
delete_shapes | Deletes shapes. There is no undo for changes made this way |
add_table | Adds a table, and add_chart adds a chart |
delete_frame | Deletes a frame and everything in it |
edit_frame | Rewrites one slide |
There are a few more for smaller jobs, like resizing, grouping, wrapping shapes in a frame, freehand strokes and slide animations. Your assistant sees all of them.
The same server also carries koboyo's icon library as seven read-only tools. They
are useful on their own, and for finding icons to put in the nodes of an
architecture or flowchart diagram. See
attributes for how a node's icon: attribute is written.
| tool | what it does |
|---|---|
search_icons | Search by subject. If you use more than one word, every word has to match |
find_icons_for | Match many things at once, like a whole nav bar or every node in a diagram |
list_categories | Every category with its icon count |
list_icons | Browse a category, or the whole library |
get_icon | One icon's name, category, keywords, size and URLs |
get_icon_svg | The SVG markup for up to 20 icons at once |
get_library_info | Library size, URL shapes and licence terms |
Ask your assistant to call get_syntax before it writes a kind of diagram it has
not written before. The koboyo language is not Mermaid, and guessing at it wastes
a round trip that the cheatsheet would have saved.
On a free workspace, every diagram goes onto your one board as a new frame, up to 12 of them. Every result tells your assistant how much room is left, so it can see the limit coming instead of hitting it by surprise. On Pro, each diagram gets its own canvas instead of stacking up on one board.
Deleting a board does not wipe it. It goes to the workspace Trash, and you can get it back from the web app for 30 days.
The embed links work on both plans. On free they carry a small koboyo mark, and on Pro they do not.
If your assistant connects without a key, it still gets a working connection. Every tool answers with instructions for signing in, so your assistant can pass them on to you instead of just telling you the server is broken.
Already have diagrams written in Mermaid? Paste them straight into
create_diagram. koboyo redraws them in its own hand-drawn style, so you get a
much better looking diagram, and an editable canvas instead of a flat image.
A few Mermaid diagram types have no exact match in koboyo, so they come out as the closest thing. The result tells you when that has happened, and which koboyo kind to ask for instead if you want to keep working on the diagram.