此 MCP 可以做什么
Creates and edits collaborative whiteboard diagrams, mind maps, flowcharts and freeform canvas elements using Mermaid or manual shapes.
功能
工具
6
工具
add_elements
Add elements to the board or create a new one
Creates elements on a canvas. Creates a new canvas if room_id is omitted, or adds to the existing canvas if room_id is provided. Use cases: wireframes, UI mockups, freeform illustrations, standalone shapes, and manual layouts that Mermaid does not cover well. For diagrams Mermaid can express, use add_elements_from_mermaid instead. Element types: rectangle, ellipse, diamond, arrow, line, freedraw, text, image. Rich text: the text field supports limited HTML for text elements and rectangle/ellipse/diamond shape labels. Supports the rich-text plugin HTML subset: <b>/<strong>, <i>/<em>, <u>, <br>, <div>/<p>, <ul>/<ol>/<li>, <a href>, <font color>, and <span style="color, background/background-color, font-size, font-family">. Use textAlign for left/center/right alignment; avoid unsupported HTML/CSS. TEXT IN SHAPES: use containerId on text element pointing to shape id. ARROWS: Position at EDGE of source shape. Auto-bound within 30px. Colors: strokeColor, backgroundColor (hex).
输入模式
{'type': 'object', 'required': ['elements'], 'properties': {'room_id': {'type': 'string', 'description': 'Room ID of an existing canvas to add to. If the user is continuing a canvas already referenced in this conversation (by room_id, or a URL like ?room=[room_id] or /gdrive?id=[room_id]), pass it here. Omit to create a new canvas.'}, 'elements': {'type': 'array', 'items': {'type': 'object', 'required': ['x', 'y'], 'properties': {'x': {'type': 'number', 'description': 'X coordinate (defaults to 0 if omitted)'}, 'y': {'type': 'number', 'description': 'Y coordinate (defaults to 0 if omitted)'}, 'id': {'type': 'string', 'description': 'Unique element ID. IMPORTANT: Always set explicit IDs for shapes that arrows will connect to!'}, 'text': {'type': 'string', 'description': 'Text content. Required for type=text. For text elements and rectangle/ellipse/diamond shape labels, Supports the rich-text plugin HTML subset: <b>/<strong>, <i>/<em>, <u>, <br>, <div>/<p>, <ul>/<ol>/<li>, <a href>, <font color>, and <span style="color, background/background-color, font-size, font-family">. Use textAlign for left/center/right alignment; avoid unsupported HTML/CSS. Also used as arrow label when set on an arrow.'}, 'type': {'enum': ['rectangle', 'ellipse', 'diamond', 'arrow', 'line', 'freedraw', 'text', 'image'], 'type': 'string', 'description': 'Element type. Inferred from fields if omitted: text field â\x86\x92 text, points â\x86\x92 line, fileId â\x86\x92 image, else rectangle.'}, 'label': {'type': 'string', 'description': 'For type=arrow: text label displayed on the arrow'}, 'width': {'type': 'number', 'description': 'Width (default: 100; omit for text â\x80\x94 auto-sized)'}, 'height': {'type': 'number', 'description': 'Height (default: 100; omit for text â\x80\x94 auto-sized)'}, 'points': {'type': 'array', 'items': {'type': 'array', 'items': {'type': 'number'}}, 'description': 'Required for arrow/line/freedraw. Coordinates relative to element x,y. Example: [[0,0],[100,0]] for horizontal arrow.'}, 'opacity': {'type': 'number', 'description': 'Opacity 0-100 (default: 100)'}, 'fontSize': {'type': 'number', 'description': 'Font size (default: 20). Applies to text elements.'}, 'fillStyle': {'type': 'string', 'description': 'Fill style: solid, hachure, cross-hatch (default: solid)'}, 'roughness': {'type': 'number', 'description': 'Roughness: 0=architect, 1=artist, 2=cartoonist (default: 1)'}, 'endBinding': {'type': 'object', 'required': ['elementId', 'focus', 'gap'], 'properties': {'gap': {'type': 'number'}, 'focus': {'type': 'number'}, 'elementId': {'type': 'string'}}, 'description': 'For type=arrow: binds the arrow end to a shape. Use instead of or alongside points.'}, 'fontFamily': {'type': 'number', 'description': 'Font family: 5=Excalifont, 6=Nunito, 7=Lilita One, 8=Comic Shanns (default: 5). Applies to text elements.'}, 'containerId': {'type': 'string', 'description': 'For type=text: ID of the shape this text is bound to. Set x,y to 0,0 for auto-centering inside the shape.'}, 'strokeColor': {'type': 'string', 'description': 'Stroke color in hex (default: #1e1e1e)'}, 'strokeWidth': {'type': 'number', 'description': 'Stroke width (default: 2)'}, 'startBinding': {'type': 'object', 'required': ['elementId', 'focus', 'gap'], 'properties': {'gap': {'type': 'number'}, 'focus': {'type': 'number'}, 'elementId': {'type': 'string'}}, 'description': 'For type=arrow: binds the arrow start to a shape. Use instead of or alongside points.'}, 'backgroundColor': {'type': 'string', 'description': "Fill color in hex or 'transparent' (default: transparent)"}}, 'description': 'Per-type required fields: rectangle/ellipse/diamond â\x86\x92 x, y (width/height default to 100). text â\x86\x92 x, y, text (width/height auto-sized; omit or set to 0). rectangle/ellipse/diamond may also include text, which creates a bound label. arrow/line â\x86\x92 x, y, points (e.g. [[0,0],[100,0]]); optionally startBinding/endBinding instead of points. image â\x86\x92 x, y, width, height, fileId. freedraw â\x86\x92 x, y, points. type is inferred from fields if omitted (text field â\x86\x92 text, points â\x86\x92 line, fileId â\x86\x92 image, else rectangle).'}, 'description': 'Array of element definitions to create'}}}
输出模式
{'type': 'object', 'required': ['url', 'isNew', 'collabUrl', 'elements', 'appState'], 'properties': {'url': {'type': 'string', 'description': 'Canvas room URL'}, 'isNew': {'type': 'boolean', 'description': 'Whether a new canvas was created'}, 'room_id': {'type': 'string', 'description': 'Canvas room ID'}, 'appState': {'type': 'object', 'properties': {'viewBackgroundColor': {'type': 'string'}}, 'description': 'Canvas app state (viewBackgroundColor, etc.)', 'additionalProperties': True}, 'elements': {'type': 'array', 'items': {'type': 'object', 'additionalProperties': True}, 'description': 'All elements currently on the canvas'}, 'collabUrl': {'type': 'string', 'description': 'Collaboration server URL for Socket.IO'}}}
add_elements_from_mermaid
Create a diagram from Mermaid, or add one to the board
Creates diagram elements from a Mermaid definition. Creates a new canvas if room_id is omitted, or adds to the existing canvas if room_id is provided. Preferred over add_elements for new diagrams and large changes to existing diagrams whenever the content can be represented in Mermaid. Supports: flowchart, graph, flowchart-elk, sequenceDiagram, classDiagram, classDiagram-v2, stateDiagram, stateDiagram-v2, erDiagram, journey, gantt, pie, gitGraph, mindmap, timeline, C4Context, C4Container, C4Component, C4Dynamic, C4Deployment, sankey, sankey-beta, quadrantChart, xychart, xychart-beta, requirement, requirementDiagram, kanban, architecture, block, block-beta, packet, packet-beta, radar-beta, treemap, info. Example: "flowchart TD\n A[Start] --> B{Decision}\n B -->|Yes| C[OK]\n B -->|No| D[Cancel]"
输入模式
{'type': 'object', 'required': ['mermaid'], 'properties': {'config': {'type': 'object', 'properties': {'flowchart': {'type': 'object', 'properties': {'curve': {'enum': ['basis', 'linear'], 'type': 'string', 'description': 'Edge curve style (handled server-side; no need to set explicitly).'}}}}, 'description': 'Optional Mermaid rendering config. flowchart.curve is handled automatically.'}, 'mermaid': {'type': 'string', 'description': 'Mermaid diagram definition. Prefer converting compatible user requests into Mermaid instead of using add_elements.'}, 'room_id': {'type': 'string', 'description': 'Room ID of an existing canvas to add to. If the user is continuing a canvas already referenced in this conversation (by room_id, or a URL like ?room=[room_id] or /gdrive?id=[room_id]), pass it here. Omit to create a new canvas.'}, 'timeout': {'type': 'number', 'default': 3600, 'description': 'Room lifetime in seconds (default: 3600, max: 86400). Only used when creating new canvas'}}}
输出模式
{'type': 'object', 'required': ['url', 'isNew', 'collabUrl', 'elements', 'appState'], 'properties': {'url': {'type': 'string', 'description': 'Canvas room URL'}, 'isNew': {'type': 'boolean', 'description': 'Whether a new canvas was created'}, 'room_id': {'type': 'string', 'description': 'Canvas room ID'}, 'appState': {'type': 'object', 'properties': {'viewBackgroundColor': {'type': 'string'}}, 'description': 'Canvas app state (viewBackgroundColor, etc.)', 'additionalProperties': True}, 'elements': {'type': 'array', 'items': {'type': 'object', 'additionalProperties': True}, 'description': 'All elements currently on the canvas'}, 'collabUrl': {'type': 'string', 'description': 'Collaboration server URL for Socket.IO'}, 'pendingMermaid': {'type': 'object', 'properties': {'config': {'type': 'object', 'additionalProperties': True}, 'definition': {'type': 'string', 'description': 'Mermaid diagram source'}}, 'description': 'Mermaid definition pending client-side rendering'}}}
delete_elements
Delete elements from the board
Delete elements from a canvas. Requires room_id from a previous Canvs tool result. Pass ids array of element IDs to delete.
可能执行破坏性操作
输入模式
{'type': 'object', 'required': ['room_id', 'ids'], 'properties': {'ids': {'type': 'array', 'items': {'type': 'string'}, 'description': 'Array of element IDs to delete'}, 'room_id': {'type': 'string', 'description': 'Room ID from a previous Canvs tool result. If you only have a URL, extract it from https://[host]/?room=[room_id] or https://[host]/gdrive?id=[room_id].'}}}
输出模式
{'type': 'object', 'required': ['url', 'isNew', 'collabUrl', 'elements', 'appState'], 'properties': {'url': {'type': 'string', 'description': 'Canvas room URL'}, 'isNew': {'type': 'boolean', 'description': 'Whether a new canvas was created'}, 'room_id': {'type': 'string', 'description': 'Canvas room ID'}, 'appState': {'type': 'object', 'properties': {'viewBackgroundColor': {'type': 'string'}}, 'description': 'Canvas app state (viewBackgroundColor, etc.)', 'additionalProperties': True}, 'elements': {'type': 'array', 'items': {'type': 'object', 'additionalProperties': True}, 'description': 'All elements currently on the canvas'}, 'collabUrl': {'type': 'string', 'description': 'Collaboration server URL for Socket.IO'}}}
get_guide
Get whiteboard instructions
Returns guidance on diagram-creation workflow and tool selection: how to choose between Mermaid and manual element creation, and the recommended iteration workflow. Consult before building complex diagrams.
只读
输入模式
{'type': 'object', 'properties': {}}
输出模式
{'type': 'object', 'required': ['guide'], 'properties': {'guide': {'type': 'string', 'description': 'Tool usage instructions text'}}}
query_elements
Find elements on the board
Query elements on a canvas. Requires room_id from a previous Canvs tool result. Returns elements matching optional filters. Use this before update_elements when making small edits to existing diagrams. If no browser has the canvas open, returns an error â ask the user to open the canvas URL in their browser and retry.
只读
输入模式
{'type': 'object', 'required': ['room_id'], 'properties': {'type': {'enum': ['rectangle', 'ellipse', 'diamond', 'arrow', 'line', 'freedraw', 'text', 'image'], 'type': 'string', 'description': 'Filter by element type'}, 'filter': {'type': 'object', 'description': 'Additional key-value filters (e.g., {locked: true})'}, 'room_id': {'type': 'string', 'description': 'Room ID from a previous Canvs tool result. If you only have a URL, extract it from https://[host]/?room=[room_id] or https://[host]/gdrive?id=[room_id].'}}}
输出模式
{'type': 'object', 'required': ['count', 'elements'], 'properties': {'count': {'type': 'number', 'description': 'Number of matching elements'}, 'elements': {'type': 'array', 'description': 'Matching elements'}}}
update_elements
Update elements on the board
Update elements on a canvas. Requires room_id from a previous Canvs tool result. Pass elements array with id and fields to update. IMPORTANT: in each update object ONLY `id` is required; all other fields are optional patch fields. Include ONLY elements that need changes; elements omitted from the request remain unchanged on the board. Prefer this tool for SMALL edits to existing diagrams (rename/move/restyle a few elements), typically after query_elements.
可能执行破坏性操作
输入模式
{'type': 'object', 'required': ['room_id', 'elements'], 'properties': {'room_id': {'type': 'string', 'description': 'Room ID from a previous Canvs tool result. If you only have a URL, extract it from https://[host]/?room=[room_id] or https://[host]/gdrive?id=[room_id].'}, 'elements': {'type': 'array', 'items': {'type': 'object', 'required': ['id'], 'properties': {'x': {'type': 'number', 'description': 'New X coordinate'}, 'y': {'type': 'number', 'description': 'New Y coordinate'}, 'id': {'type': 'string', 'description': 'ID of the element to update (required)'}, 'text': {'type': 'string', 'description': 'New text content. For text elements and rectangle/ellipse/diamond shape labels, Supports the rich-text plugin HTML subset: <b>/<strong>, <i>/<em>, <u>, <br>, <div>/<p>, <ul>/<ol>/<li>, <a href>, <font color>, and <span style="color, background/background-color, font-size, font-family">. Use textAlign for left/center/right alignment; avoid unsupported HTML/CSS. Shape text updates the bound label.'}, 'type': {'enum': ['rectangle', 'ellipse', 'diamond', 'arrow', 'line', 'freedraw', 'text', 'image'], 'type': 'string', 'description': 'New element type'}, 'width': {'type': 'number', 'description': 'New width'}, 'height': {'type': 'number', 'description': 'New height'}, 'locked': {'type': 'boolean', 'description': 'Lock/unlock the element'}, 'points': {'type': 'array', 'items': {'type': 'array', 'items': {'type': 'number'}}, 'description': 'New points array (for arrow/line/freedraw elements)'}, 'opacity': {'type': 'number', 'description': 'New opacity (0-100)'}, 'fontSize': {'type': 'number', 'description': 'New font size (for text elements)'}, 'fillStyle': {'type': 'string', 'description': 'New fill style (solid, hachure, cross-hatch)'}, 'roughness': {'type': 'number', 'description': 'New roughness (0=architect, 1=artist, 2=cartoonist)'}, 'fontFamily': {'type': 'number', 'description': 'New font family (5=Excalifont, 6=Nunito, 7=Lilita One, 8=Comic Shanns)'}, 'strokeColor': {'type': 'string', 'description': 'New stroke color (hex)'}, 'strokeWidth': {'type': 'number', 'description': 'New stroke width'}, 'backgroundColor': {'type': 'string', 'description': "New fill color (hex or 'transparent')"}}, 'description': 'Patch object: only id is required. Include only the fields you want to change.'}, 'description': 'Array of element updates (each must have id)'}}}
输出模式
{'type': 'object', 'required': ['url', 'isNew', 'collabUrl', 'elements', 'appState'], 'properties': {'url': {'type': 'string', 'description': 'Canvas room URL'}, 'isNew': {'type': 'boolean', 'description': 'Whether a new canvas was created'}, 'room_id': {'type': 'string', 'description': 'Canvas room ID'}, 'appState': {'type': 'object', 'properties': {'viewBackgroundColor': {'type': 'string'}}, 'description': 'Canvas app state (viewBackgroundColor, etc.)', 'additionalProperties': True}, 'elements': {'type': 'array', 'items': {'type': 'object', 'additionalProperties': True}, 'description': 'All elements currently on the canvas'}, 'collabUrl': {'type': 'string', 'description': 'Collaboration server URL for Socket.IO'}}}
历史
近期工具变更
已添加
add_elements_from_mermaid
2026年9月17日 12:53
已添加
query_elements
2026年9月17日 12:53
已添加
delete_elements
2026年9月17日 12:53
已添加
update_elements
2026年9月17日 12:53
已添加
add_elements
2026年9月17日 12:53
已添加
get_guide
2026年9月17日 12:53
发现
类似的 MCP 服务器
cnvs.app
app.cnvs/whiteboard
Creates and edits real-time collaborative whiteboards and kanban boards with text, links, images, drawings, columns, tasks, previ…
DocuQueue MCP
io.github.dvcoolarun/docuqueue-mcp
Creates templated PDFs and presentation decks, extracts branding, previews documents, and provides downloadable or shareable outp…
Renderball
com.renderball/renderball
Creates, edits, renders, previews, and shares presentation decks from outlines and submitted deck files.
getdeck
studio.dodraft/getdeck
Searches slide layouts and themes, composes presentation decks, provides previews, and exports decks to PPTX.
tldraw
io.github.tldraw/tldraw
Creates, edits, searches, and persists collaborative diagrams and visual content on tldraw canvases.
slide-deck.io
io.slide-deck/mcp
Generates status and project reports or populates PowerPoint templates using connected data sources.
MindMap
com.keenethics-labs/mindmap
Renders hierarchical outlines and notes as interactive mind maps.
IndianAppGuy-magicslide-mcp-actual-test
ai.smithery/IndianAppGuy-magicslide-mcp-actual-test
Generates formatted PowerPoint presentations from text prompts, YouTube videos, or structured outlines.