@diagrammo/dgmo-mcp

中文文档
0.29.15发布于 2026/11/08MITTypeScriptES Module构建来源已验证近 30 天下载 2334

MCP server for rendering DGMO diagrams — SVG/PNG output, browser preview, HTML reports, and 50+ chart types. Works with Claude Desktop, Claude Code, and any MCP client.

原始使用文档
文档目录11 节
  1. What you can do
  2. Tools
  3. Beyond the MCP server
  4. Setup
  5. Easiest — one command
  6. Manual configuration
  7. Serving over HTTP
  8. Privacy
  9. Dev hub (AI-tuning tools)
  10. Contributing & releases
  11. License

@diagrammo/dgmo-mcp

Turn a conversation into a real diagram — without leaving your AI tool.

npm version npm downloads license

This MCP server gives Claude (and any MCP-compatible AI tool) the ability to render sequence diagrams, flowcharts, ER diagrams, C4 architecture, gantt charts, and 40+ other chart types from concise text markup — then hand the result off to a full editor for refinement. Ask for a diagram in chat; get a real one back.

Sequence diagram C4 architecture diagram
Gantt chart Flowchart

What you can do

Ask in plain language — "diagram the auth flow as a sequence", "chart the Q3 plan as a gantt", "draw our services as a C4 diagram" — and Claude writes the markup and renders it. The markup stays readable and diffable:

flowchart Mutiny Resolution
direction-tb

[Sail]     Set sail under the captain
{Trouble?} Discontent in the crew?
{Vote}     Crew vote called
[Mutiny]   Seize the ship

(Sail) -> (Trouble?)
(Trouble?) -Yes-> (Vote)
(Vote) -Mutiny-> (Mutiny)

→ renders to the flowchart above. All rendering happens locally — no diagram data leaves your machine.

Tools

ToolWhat it doesOver HTTP
render_diagramRender DGMO markup to SVG or PNGyes
validate_diagramCheck markup and report parse errors, without renderingyes
suggest_chart_typeSuggest the chart types that fit a descriptionyes
list_chart_typesList all supported chart types, marking the beta onesyes
get_language_referenceGet DGMO syntax documentation for accurate generationyes
get_examplesFetch worked examples for a chart typeyes
share_diagramGet a shareable diagrammo.app URL — hand your diagram to the web editoryes
open_in_appOpen the diagram straight into the Diagrammo desktop app for editingno
check_app_installedReport whether the desktop app is installedno
preview_diagramRender one or more diagrams and open an HTML preview in the browserno
generate_reportBuild a polished multi-section HTML report with ToC and optional sourceno
put_space_diagramWrite a diagram into a Diagrammo Cloud space, by folder and titleyes
get_space_diagramRead a diagram from a Cloud space, by id or by folder and titleyes
list_space_diagramsList every diagram in a Cloud spaceyes

The three space tools send the diagram to Diagrammo Cloud. They need a space API key (minted on the Diagrammo account page) as DGMO_API_KEY in the server's environment — never as a tool argument, so the key stays out of the transcript.

share_diagram and open_in_app are the bridge out of chat: a diagram Claude generates becomes something you can refine, restyle, and embed — see below.

The four marked no open a browser or launch the desktop app. Over HTTP that would happen on the machine running the server rather than on yours, so they are not offered there — see Serving over HTTP.

Beyond the MCP server

The MCP server is one entry point into Diagrammo — a whole ecosystem built on the same DGMO markup. Generate in chat, refine in a real editor, embed anywhere:

  • diagrammo.app — the desktop app. open_in_app drops an AI-generated diagram straight into it, with live preview, palettes, and export.
  • online.diagrammo.app — a full editor in the browser, zero install. share_diagram URLs open right here.
  • Docs integrations — drop DGMO fenced code blocks into your docs site: remark-dgmo, astro-dgmo, docusaurus-plugin-dgmo, fumadocs-dgmo.
  • Obsidian — the Diagrammo Diagrams community plugin renders DGMO in your vault.
  • CLI — npx @diagrammo/dgmo-cli file.dgmo -o out.png, or install it with npm install -g @diagrammo/dgmo-cli (macOS and Linux).

One markup, everywhere. A diagram you generate here renders identically in the app, in your docs, and in Obsidian — because they all speak DGMO.

→ Try it free at diagrammo.app

Setup

Easiest — one command

Install the dgmo CLI and let it wire everything up:

npm install -g @diagrammo/dgmo-cli   # macOS and Linux
dgmo install                         # auto-detects Claude Code, Codex, Claude Desktop, Cursor, …

Prefer Homebrew or pacman? See diagrammo.app/dev.

dgmo install configures each detected assistant non-interactively and points it at dgmo mcp, so there's no separate package to install or prompts to answer. Target one surface with dgmo install claude-code (or codex, claude-desktop, …).

Manual configuration

Prefer to edit configs yourself? Point any MCP client at the server via npx (no global install needed):

Claude Code — .claude/settings.local.json; Claude Desktop — ~/Library/Application Support/Claude/claude_desktop_config.json:

{
  "mcpServers": {
    "dgmo": {
      "command": "npx",
      "args": ["-y", "@diagrammo/dgmo-mcp"]
    }
  }
}

If you have the dgmo CLI installed, { "command": "dgmo", "args": ["mcp"] } works too. Restart the client after saving — the tools appear automatically.

Serving over HTTP

The setups above launch the server as a child process and talk to it over its standard input and output. That needs the server and the client on the same machine. Where they are not — a hosted agent platform, a container, one server shared by several people — start it as an HTTP endpoint instead. The same endpoint also suits one machine, when you want a single server always running for every AI tool you use:

dgmo mcp --http                              # with the dgmo CLI installed
npx -y @diagrammo/dgmo-mcp --http            # http://127.0.0.1:3333/mcp
MCP_TRANSPORT=http MCP_PORT=8080 npx -y @diagrammo/dgmo-mcp

Every option takes a flag or an environment variable, whichever your setup can express:

FlagVariableDefaultWhat
--httpMCP_TRANSPORT=httpoffServe streamable HTTP instead of stdio
--port <n>MCP_PORT3333Port to listen on
--host <addr>MCP_HOST127.0.0.1Interface to bind
--path <path>MCP_PATH/mcpPath the endpoint answers on
--allow-host <h>MCP_ALLOWED_HOSTSloopbackExtra Host headers to accept, repeatable
--allow-origin <o>MCP_ALLOWED_ORIGINSown originOrigin headers to accept, repeatable

Each request is served independently — no sessions, nothing kept between calls — so one endpoint can serve several clients at once.

The server has no authentication of its own. It binds loopback by default and rejects requests carrying a Host header it was not told to expect, or an Origin header other than its own unless --allow-origin names it, which is enough for a client on the same machine or inside the same container. Anything reachable from a wider network needs your own authentication in front of it, and --allow-host for the hostname it will be reached by. Binding a non-loopback interface without naming a host prints a warning saying so.

--help prints all of this from the installed version.

Keep it running

Run the server as a background service so it starts at login and restarts if it stops. Change the dgmo path to what which dgmo prints.

Linux — systemd user service, saved as ~/.config/systemd/user/dgmo-mcp.service:

[Unit]
Description=Diagrammo MCP server over HTTP
After=network.target

[Service]
ExecStart=%h/.local/bin/dgmo mcp --http
Environment=PATH=%h/.local/bin:/usr/local/bin:/usr/bin:/bin
Restart=on-failure
RestartSec=3

[Install]
WantedBy=default.target
systemctl --user daemon-reload
systemctl --user enable --now dgmo-mcp

macOS — launchd agent, saved as ~/Library/LaunchAgents/app.diagrammo.mcp.plist:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>Label</key><string>app.diagrammo.mcp</string>
  <key>ProgramArguments</key>
  <array>
    <string>/opt/homebrew/bin/dgmo</string><string>mcp</string><string>--http</string>
  </array>
  <key>EnvironmentVariables</key>
  <dict><key>PATH</key><string>/opt/homebrew/bin:/usr/local/bin:/usr/bin:/bin</string></dict>
  <key>RunAtLoad</key><true/>
  <key>KeepAlive</key><true/>
</dict>
</plist>
launchctl bootstrap gui/$(id -u) ~/Library/LaunchAgents/app.diagrammo.mcp.plist

Then point each AI tool at http://127.0.0.1:3333/mcp as a streamable-HTTP MCP server.

Privacy

All rendering is local. Your diagram markup and the images it produces never leave your machine, except when you explicitly call share_diagram (which encodes the diagram into a diagrammo.app URL). See the privacy terms.

Dev hub (AI-tuning tools)

pnpm hub

One command, one server, one browser tab. The hub opens a tabbed shell over the three AI-tuning dev tools — switch between them with the top tabs, no separate ports or commands to remember:

  • Trigger tuning — edit the phrase/concept vocabulary that drives suggest_chart_type, score prompts live, save back to triggers.json.
  • LLM judge — judge chart-type descriptions against prompts with claude -p.
  • Guidance studio — author the per-type styling guidance the server delivers (the <!-- TIPS --> blocks in dgmo's language-reference.md, sliced into get_language_reference): pick a type, edit how the AI is told to style it, run a prompt against a committed dataset fixture (so inputs never move between runs), and see the generated DGMO + rendered image side by side. The picker doubles as a coverage bar; "Compare 3×" renders no-guidance vs your tips for a by-eye check; Save validates and writes back to language-reference.md.

These tools are dev-only and never bundled into the published server. (The standalone pnpm harness and pnpm studio scripts still run a single tool each if you ever want one in isolation.)

Contributing & releases

Development setup and the release workflow live in CONTRIBUTING.md.

License

MIT

版本与发布记录

@diagrammo/dgmo-mcp 共发布 87 个版本,首次发布于 2026/03/01;过去 12 个月发布了 87 个版本。最新版本附带 npm provenance 构建来源证明,可追溯到公开的 CI 构建记录。

版本发布日期距今
0.29.15latest2026/11/084 天前
0.29.142026/11/0211 天前
0.29.132026/10/2816 天前
0.29.122026/10/2618 天前
0.29.112026/10/2024 天前
0.29.102026/10/1430 天前

关于 @diagrammo/dgmo-mcp 的常见问题

@diagrammo/dgmo-mcp 是什么?

MCP server for rendering DGMO diagrams — SVG/PNG output, browser preview, HTML reports, and 50+ chart types. Works with Claude Desktop, Claude Code, and any MCP client.

如何安装 @diagrammo/dgmo-mcp?

在项目目录运行 npm install @diagrammo/dgmo-mcp,或使用 pnpm add / yarn add / bun add。它还提供命令行工具 dgmo-mcp,可以用 npx dgmo-mcp 直接运行。

@diagrammo/dgmo-mcp 支持 TypeScript 吗?

支持。包内自带 TypeScript 类型声明(package.json 声明了 types 入口),安装后即可获得类型提示,无需再安装 @types 包。

@diagrammo/dgmo-mcp 支持 ESM 还是 CommonJS?

以 ES Module 形式发布,推荐使用 import 引入。在 CommonJS 项目中,Node.js 20.19+ / 22.12+ 可以直接 require() 不含顶层 await 的 ES Module,更早的版本需要改用动态 import()。

@diagrammo/dgmo-mcp 需要什么版本的 Node.js?

package.json 的 engines 字段要求 Node.js >=20.6。版本不符时 npm 默认只给出警告,开启 engine-strict 后会拒绝安装。

@diagrammo/dgmo-mcp 可以商用吗?

@diagrammo/dgmo-mcp 使用 MIT 许可。宽松许可:允许商业使用、修改和再分发,通常只需在分发时保留原版权与许可声明。以上为概括,不构成法律意见,请以许可原文为准。

@diagrammo/dgmo-mcp 的下载量有多少?

根据 npm 官方下载统计,@diagrammo/dgmo-mcp 在 2026/10/12 – 2026/11/10 这 30 天内被下载 2,334 次,日均约 78 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入,适合横向比较热度,不能直接等同于使用人数。

@diagrammo/dgmo-mcp 还在维护吗?

最新版本 0.29.15 发布于 2026/11/08(4 天前);至今共发布 87 个版本,其中过去 12 个月发布了 87 个;首次发布于 2026/03/01。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。