MCP.Market

diagram-maker skill

by openclaw·openclaw/openclaw·394k stars·MIT

Create SVG/HTML or Excalidraw diagrams for concepts, architecture, flows, and whiteboards.

A100/100content scan

Is the diagram-maker skill safe?

Clean: nothing in its files matched our rules. We read 3 files in the folder on 2026-10-25.

No findings.

Install the diagram-maker skill

A skill is a folder. Copy it into your agent's skills folder and the agent loads it when the task matches its description. 

git clone --depth 1 https://github.com/openclaw/openclaw.git /tmp/openclaw
mkdir -p ~/.claude/skills
cp -r /tmp/openclaw/skills/diagram-maker ~/.claude/skills/diagram-maker
available in every project

In the Claude apps, zip the folder and upload it from the Skills settings. The folder on GitHub

The instructions your agent would load

SKILL.md as published, without the frontmatter. Read it on GitHub

Diagram Maker

Create diagrams as artifacts, not prose. Choose one output mode:

  • clean-svg: educational concepts, physical systems, processes, lifecycle, simple data flow.
  • architecture-svg: software/cloud/infra topology, services, databases, queues, trust zones.
  • excalidraw: editable hand-drawn whiteboard, flowchart, sequence, architecture sketch.

Routing

  • User wants editable/collaborative: choose Excalidraw.
  • User wants polished standalone browser output: choose SVG/HTML.
  • Software architecture with infra components: choose architecture SVG.
  • Science, product, process, concept map, physical object: choose clean SVG.
  • Unsure: ask one short question only if output format matters; otherwise choose clean SVG.

Workflow

  1. Extract nodes, groups, labels, and directed relationships.
  2. Pick layout first: left-to-right, top-down, hub-spoke, swimlanes, layered stack, sequence.
  3. Keep labels short. Prefer 5-9 main elements over dense diagrams.
  4. Generate the file at the requested path, or ./diagram.html / ./diagram.excalidraw.
  5. Verify syntax by opening/parsing when feasible.

SVG/HTML rules

  • Single standalone .html file with inline CSS and inline SVG.
  • No external fonts, JS, images, gradients, glows, decorative blobs, or remote assets.
  • Use semantic colors, not rainbow sequences: neutral, input, process, storage, external, risk.
  • Draw connectors before nodes so arrows sit behind boxes.
  • Every connector path has fill="none" and a marker arrow when directed.
  • Leave 24px text padding inside boxes; do not let text touch borders.
  • Legend only when symbols/colors are not obvious.

SVG template

Use references/svg-template.md as the wrapper and replace <!-- SVG -->.

Excalidraw rules

  • Save .excalidraw JSON with type, version, source, elements, and appState.
  • Use bound text for shape labels. Do not use a nonstandard label property.
  • Keep bound text immediately after its container in the elements array.
  • Minimum labeled shape: 120x60. Minimum body text: 16px.
  • Use roughness 1, fontFamily: 1, and simple fills.

For exact Excalidraw element snippets, read references/excalidraw-patterns.md.

More skills from openclaw/openclaw

  • A1passwordSet up and use 1Password CLI for sign-in, desktop integration, and reading or injecting secrets.
  • Aacp-routerRoute plain-language requests for Claude Code, Cursor, Copilot, OpenClaw ACP, OpenCode, Gemini CLI, Grok Build, Qwen, Kiro, Kimi, iFlow, Factory Droid, Kilocode, or explicit ACP harness work into either OpenClaw ACP runtime sessions or direct acpx-driven sessions ("telephone game" flow). For coding-agent thread requests, read this skill first, then use only `sessions_spawn` for thread creation. Codex chat binding defaults to the native Codex app-server plugin unless ACP is explicit or background spawn needs ACP.
  • Aadd-model-providerAdd and live-prove a model provider with non-interactive config one-liners, without exposing credentials.
  • Aagent-transcriptRequested GitHub PR/issue agent transcripts: redact, trim, preview, and insert safely.
  • Aapple-notesCreate, view, edit, delete, search, move, or export Apple Notes via the memo CLI on macOS.
  • Aapple-remindersList, add, edit, complete, or delete Apple Reminders and reminder lists via remindctl.
  • Aauto-qaRun OpenClaw-wide autonomous QA and live/stress campaigns across independent subsystem lanes, with verified fixes and a resumable evidence report.
  • AautoreviewStructured code review through the shared OpenClaw agent-skills installation.
  • Abear-notesCreate, search, and manage Bear notes via grizzly CLI.
  • Ablock-kitUse proactively for structured or interactive Slack replies, and when asked to author or validate native Slack Block Kit JSON.
  • AblogwatcherMonitor blogs and RSS/Atom feeds for updates using the blogwatcher CLI.
  • AblucliBluOS CLI (blu) for discovery, playback, grouping, and volume.

All agent skills → · MCP servers