Every way to use Diagrammo

The same engine ships as a CLI, an npm library, a Claude Code skill, an MCP server, and prompts for plain LLMs. Pick the surface that matches how you already work.

In your workflow

Generate diagrams as part of how you already write code, docs, and notes. No web app round-trip — just text in, image out.

CLI

Render .dgmo files from the terminal.

Wire diagrams into Makefiles, build scripts, CI pipelines, or pre-commit hooks. Outputs SVG, PNG, or HTML — no GUI required, runs anywhere Node does.

bash
# install
brew install diagrammo/dgmo/dgmo

# render to SVG
dgmo render arch.dgmo -o arch.svg

# pipe markup via stdin in a script
echo "sequence
A -> B: hi" | dgmo render -o out.png
CLI reference →

npm Library

Embed Diagrammo rendering in any JS/TS app.

Drop a live diagram into a React/Vue/Svelte page, an Astro site, or a Node service. No iframes, no canvas tricks — same engine the desktop app uses, distributed as ESM and CJS.

ts
import { renderDiagram } from '@diagrammo/dgmo';

const svg = await renderDiagram(`
sequence
Alice -> Bob: order
Bob -> Alice: receipt
`);

document.getElementById('preview').innerHTML = svg;
Library docs →

With your AI assistant

Let Claude, Cursor, ChatGPT, and other LLMs draw diagrams that actually render — instead of generating broken Mermaid you have to fix by hand.

MCP Server

A render tool for Claude Code, Cursor, and other MCP hosts.

Adds Diagrammo as a Model Context Protocol server so your AI assistant can call render() directly. The model writes DGMO, the server returns a real SVG — no more guessing whether the syntax is valid.

bash
# Claude Code
claude mcp add dgmo -- npx -y @diagrammo/dgmo-mcp

# then ask Claude:
"Draw a sequence diagram for the OAuth flow
 and save it to docs/auth.svg"
MCP setup →

Claude Code Skill

A /dgmo skill installed straight into Claude Code.

Installs alongside the dgmo CLI via Homebrew. Run one command and Claude Code gains a /dgmo skill in every project — it knows the syntax, can render diagrams to disk, and uses the local CLI for output. No MCP host setup, no per-project config.

bash
# install the CLI (skill ships with it)
brew install diagrammo/dgmo/dgmo

# add the skill to Claude Code
dgmo --install-claude-skill

# in any project, just ask:
/dgmo draw the OAuth flow as a sequence diagram
Skill details →

AI Integrations

Prompts and cheat sheets for any LLM.

A handful of system prompts, syntax references, and example libraries you can drop into ChatGPT, Claude.ai, or a custom GPT to get reliable DGMO output without setting up MCP.

text
You are a diagram assistant. Output DGMO syntax only.
Supported chart types: sequence, flow, er, gantt,
class, c4, infra, sitemap, kanban, org, timeline…

User: "Show the checkout flow as a sequence diagram."
AI guides →
Not sure where to start? If you just want to draw a diagram, open the editor. If you're wiring diagrams into a build or an AI workflow, the CLI and MCP server are usually the right entry points.