Power your agent
คำสั่งของผู้เผยแพร่เอง ไม่ใช่เอนด์พอยต์ของ PlugMCP
Host a copy with our keys and logs.
npx -y @diagrammo/[email protected]Claude Code ไม่มีลิงก์ติดตั้งสำหรับคำสั่งแบบโลคัล ให้คัดลอกคำสั่งด้านล่างแล้วรันในเทอร์มินัล
claude mcp add diagrammo-dgmo-cli -- npx -y @diagrammo/dgmo-cli@0.100.0รันในเทอร์มินัล
{ "mcpServers": { "diagrammo-dgmo-cli": { "command": "npx", "args": [ "-y", "@diagrammo/[email protected]" ] } }}claude_desktop_config.json
URL แบบรีโมตหรือคำสั่งบนเครื่องของคุณ? การติดตั้งสองแบบต่างกันอย่างไร
รันบน PlugMCP
A new server you create. It is not this listing's official endpoint. Use the publisher install when you want their URL and their credentials.
เปิดจากผู้เผยแพร่
@diagrammo/dgmoWrite plain-text .dgmo files, get clean, themeable diagrams and charts. One markup language, 50+ chart types — flowcharts, sequence diagrams, ER, org charts, C4, gantt, maps, bar/line/pie, and a lot more.
Render DGMO diagrams to PNG or SVG from the terminal, and wire the DGMO MCP server into AI editors.
sequence Boarding the Marauder
Quartermaster -Hoist the colors-> Crew
Crew -Aye, captain-> Bosun
Bosun -Heading 270-> Helm
Helm -On course-> Quartermaster
That's a complete diagram. No coordinates, no XML, no drag-and-drop — just text you can diff, review, and version like any other source file.
Want a richer editing experience than a text file? The Diagrammo desktop app (native macOS, offline, auto-updating) and the online editor (any browser, nothing to install) turn DGMO into a full authoring environment:
.dgmo files are plain text on disk, work fully offline, and never go stale the way an exported image doesBecause every diagram is just text, it lives in git, diffs cleanly in PRs, and drops straight into your docs, your AI tools, or any web page.
→ Start at diagrammo.app
# Library
npm install @diagrammo/dgmo
# CLI (macOS and Linux)
npm install -g @diagrammo/dgmo-cli
# CLI (no install)
npx @diagrammo/dgmo-cli diagram.dgmo
Homebrew and Arch/Omarchy (pacman) installs of the CLI are listed at diagrammo.app/dev.
dgmo # creates a sample.dgmo to get you started
dgmo diagram.dgmo # → diagram.png
dgmo diagram.dgmo -o out.svg # → SVG (format from extension)
cat diagram.dgmo | dgmo > out.png # pipe in, PNG to stdout
dgmo diagram.dgmo --theme dark --palette catppuccin
Render any diagram to an SVG string — no browser, no visible DOM:
import { render } from '@diagrammo/dgmo';
const { svg } = await render(
`
bar Revenue by Quarter
Q1 12
Q2 19
Q3 15
Q4 22
`,
{ theme: 'light', palette: 'slate' }
);
render() auto-detects the chart type and dispatches to the right engine. Need the lower-level parsers, config builders, and per-type renderers? They live under the @diagrammo/dgmo/advanced subpath — see the docs for the full surface and stability contract.
Add one <script> tag and every <pre class="dgmo"> block renders on load:
<script src="https://cdn.jsdelivr.net/npm/@diagrammo/dgmo-standalone/dist/auto.js"></script>
<pre class="dgmo">
pie Crew Rations
Grog: 58
Hardtack: 21
Limes: 21</pre
>
Prefer an explicit element? Use <dgmo-diagram> from the same package:
<script src="https://cdn.jsdelivr.net/npm/@diagrammo/dgmo-standalone/dist/element.js"></script>
<dgmo-diagram palette="slate"
>pie Crew Rations Grog: 58 Hardtack: 21 Limes: 21</dgmo-diagram
>
Theme detection, copy button, and "open in editor" come for free. Full config, framework recipes (Astro, Docusaurus, Hugo, MkDocs), self-hosting, and CSP guidance: diagrammo.app/embed.
Using a docs framework? First-class plugins wrap all of this:
remark-dgmo · astro-dgmo · docusaurus-plugin-dgmo · fumadocs-dgmo · nextra-dgmo · vitepress-dgmo
Claude, Cursor, Codex, and other agents can author and render DGMO directly. One command sets up every assistant you have — no second package, no prompts:
dgmo install
It auto-detects Claude Code, Codex, Claude Desktop, Cursor, Windsurf, and Copilot and wires each one to the bundled MCP server. More: diagrammo.app/ai.
Data charts — bar · line · area · pie · doughnut · radar · polar-area · bar-stacked · multi-line · scatter · heatmap · funnel · sankey · chord
Visualizations — slope · wordcloud · arc · timeline · venn · quadrant · tech-radar · cycle · pyramid · ring · function · map
Diagrams — sequence · flowchart · class · er · org · c4 · state · infra · kanban · sitemap · mindmap · gantt · pert · journey-map · boxes-and-lines · wireframe · raci · rasci · daci
Beta — expect rough edges and syntax changes: c4, sketch, venn, whiteboard. dgmo types marks them too.
Every chart type is categorized with live examples at diagrammo.app/reference.
Each type's full syntax, directives, and options live in the Language Reference — the authoritative spec.
Built-in palettes, each with light, dark, and transparent variants:
slate (default) · atlas · blueprint · tidewater · nord · catppuccin · tokyo-night
Register your own with registerPalette(). Color helpers (getPalette, tint, mute, contrastText, …) and Mermaid theme-variable generation ship from the package too — see the docs.
Syntax highlighting and autocomplete for .dgmo files ship as ready-to-use exports:
@diagrammo/dgmo/highlight — standalone highlighter@diagrammo/dgmo/editor — CodeMirror 6 language supportBoth back the desktop app and the live editor.
pnpm install
pnpm build # tsup → dist/ (ESM + CJS + CLI)
pnpm test # vitest
pnpm typecheck
MIT © Demian Neidetcher
Render DGMO diagrams to PNG or SVG from the terminal, and wire the DGMO MCP server into AI editors.
{ "mcpServers": { "diagrammo-dgmo-cli": { "command": "npx", "args": [ "-y", "@diagrammo/[email protected]" ] } }}เครื่องมือ
ยังไม่มีรายการเครื่องมือ เซิร์ฟเวอร์แบบรีโมตจะได้รายการหลังการตรวจสอบสถานะครั้งแรก
FAQ
คัดลอกคอนฟิก stdio สำหรับ Cursor, Claude Desktop, Claude Code หรือ VS Code ได้ในหน้านี้ คอนฟิกนี้ใช้การติดตั้งของผู้เผยแพร่ ไม่ใช่พร็อกซีของ PlugMCP
ระเบียนนี้ไม่ได้ระบุตัวแปรสภาพแวดล้อมที่จำเป็น
@diagrammo/dgmo Cli ทำงานแบบโลคัลผ่าน stdio
ตรวจสอบล่าสุดเมื่อ 2026-11-13 Render DGMO diagrams to PNG or SVG from the terminal, and wire the DGMO MCP server into AI editors.