Provides a sandboxed MCP App for previewing and editing Mermaid diagrams. The render_mermaid tool accepts Mermaid source and an optional title, prepares a payload, and links to an editor UI that renders diagrams offline with a bundled Mermaid engine. It validates diagrams in the browser, reports rendering status, preserves edits in the mounted frame, and returns structured source for hosts without MCP Apps support.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type @ followed by the MCP server name and your instructions, e.g., "@Mermaid Diagrams render a sequence diagram for user login with MFA"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Preview and edit Mermaid diagrams in a sandboxed MCP App. Rendering works offline with the bundled Mermaid 11.16.1 engine. English and Chinese UI follow the host's locale; theme changes keep the current source edits.
在隔离的 MCP App 中预览和编辑 Mermaid 图示，内置 Mermaid 引擎，支持离线渲染。 界面跟随宿主的中英文和明暗主题设置，切换时保留编辑内容。
Install this directory through OpenAgent's local plugin installation. The package
uses the host-provided Node interpreter and has no credential or configuration
requirements. Its relay tool is discovered on request; default diagrams in
OpenAgent remain reply-text AGUI Mermaid(source: ..., title?: ...) components.
render_mermaid accepts complete source and optional title, returns a
prepared payload, and links ui://mermaid/editor.html with MIME type
text/html;profile=mcp-app. Browser rendering validates the diagram in the app.
On a syntax error, edit and render again or explicitly ask the Agent to fix it.
The app reports rendering status through ui/update-model-context.
Hosts without MCP Apps receive a text response and structured source. The server
does not claim browser validation from its preparation result.
The UI verifies parent messages and performs the standard MCP Apps initialization handshake. It requests no network access. Source is data and Mermaid runs with strict security. Editing stays in the mounted frame; a conversation reload restores the original tool payload. Repeated host payloads and turn completion preserve edits in the mounted frame. The app does not persist unsaved local edits.
Develop with bun install --frozen-lockfile, bun run build, and bun test.
The generated self-contained HTML must stay below 4 MiB; commit it and the
bundled Mermaid license so installed packages need no build step.
This server cannot be deployed
Render, verify, describe, and safely edit Mermaid diagrams through MCP.
Create, edit, preview, and deploy full-stack web apps to a live URL from any MCP client.
Immutable agent diagrams: create, edit, validate and render versioned diagrams over MCP.
MCP-native collaborative markdown editor with real-time AI document editing
