/drawio

name: drawio
version: "2.8.0"
description: "Create, edit, replicate, import, and export draw.io diagrams with an offline YAML-first workflow: architecture, network topologies, flowcharts, UML/ER, org charts, Mermaid/CSV conversion, existing .drawio bundles, style presets, themes, and non-publication formula diagrams. For publication figures (paper, thesis, IEEE, camera-ready) use drawio-academic-skills instead."
license: MIT
homepage: https://github.com/bahayonghang/drawio-skills
compatibility: "Node 20+ for the YAML/CLI workflow. draw.io Desktop produces the default 300dpi PNG (plus PDF/JPG or embedded .drawio.svg); without it, image exports fall back to a standalone SVG. No MCP server is required for offline authoring; the optional live-refinement backend needs a browser/MCP provider."
platforms: [macos, linux, windows]
metadata:
  category: visual-design
  tags:
    - diagram
    - drawio
    - architecture
    - flowchart
    - network-topology
    - uml
    - mermaid
    - csv
    - design-system
    - math
argument-hint: [diagram-description-or-instruction]
allowed-tools: Read, Write, Bash, AskUserQuestion

Draw.io Base Skill

Create, edit, validate, replicate, import, and export draw.io diagrams through a YAML-first offline workflow. It is the single maintained base for sibling overlays and owns the local CLI, schemas, references, themes, palettes, examples, style presets, and export helpers.

Scope

Use this base skill for general draw.io work: software/system architecture; network topologies and infrastructure maps; flowcharts, swimlanes, process maps, and org charts; UML class/sequence/state/ER; Mermaid and CSV conversion; structured redraw and non-academic replication; formula-bearing technical diagrams; `.drawio` import, sidecar export, and local validation.

For paper, thesis, IEEE, journal, manuscript, or publication-ready figure requests, route to the sibling `drawio-academic-skills` overlay; the base does not apply academic publication gates. Without the overlay, render the local YAML bundle but report that overlay policy was not applied.

Runtime Stack

Use the lightest path that satisfies the request:

• **Offline Authoring Path (default)** — the YAML spec generates the final `.drawio` plus the default delivered image, a **300dpi PNG** via draw.io Desktop (standalone SVG fallback).
• **Desktop-Enhanced Export** — 300dpi PNG default, plus PDF/JPG or embedded `.drawio.svg` on explicit request.
• **Live Refinement Backend (optional)** — browser refinement provider only; the offline bundle remains canonical. Provisioned by the tracked `.mcp.json` (pinned `@next-ai-drawio/mcp-server@0.4.13`, fetched over the network by `npx`; see `references/docs/mcp-tools.md`); offline authoring never reads it.
• **Direct XML Exception** — tiny one-off or raw mxGraph handoff when exact XML control is the real requirement.

The optional MCP/live backend is a refinement provider only. Never required for normal authoring, editing, import, replication, or export.

Task Routing

Choose the route first, then load only that route's references. All paths below live under `references/`; the reusable YAML example catalog is `references/examples/README.md`.

• `create` — new diagram from text, YAML, Mermaid, CSV, or a concise spec → `workflows/create.md`, `docs/design-system/README.md`, `docs/design-system/specification.md`
• `config-import` — declared Terraform, Kubernetes, Compose, SQL DDL, OpenAPI, GitHub Actions, or GitLab CI architecture → `docs/config-importers.md`, `docs/canonical-graph-projection.md`
• `live-drift` — compare explicit Terraform state/plan JSON, Docker inspect JSON, or Kubernetes live JSON against a declared projection without capture → `docs/live-snapshots-drift.md`, `docs/canonical-graph-projection.md`, `workflows/visual-review.md`
• `code-import` — Python module/class, JavaScript/TypeScript ESM, Go package, or Rust module relationships from a local project directory → `docs/code-importers.md`, `docs/canonical-graph-projection.md`
• `multi-page` — create, import, validate, or transform bundle v1 pages with stable page/object identity and structured links → `docs/upstream-capability-compatibility.md`, `docs/xml-format.md`
• `raster-replicate` — normalize a trusted structured visual extraction through `--input-format raster-extraction` before canonical rendering → `workflows/replicate.md`, `docs/upstream-capability-compatibility.md`
• `local-image` — embed local PNG/JPEG files as atomic image nodes through top-level `assets` and `node.image` → `docs/local-image-assets.md`
• `postprocess` — project or transform canonical YAML/Draw.io with offline `mermaid`, `explain`, `relabel`, `restyle`, `heatmap`, or script-free `html` → `docs/upstream-capability-compatibility.md`
• `architecture` — system/software architecture, microservice or cloud-service maps with role-based color coding, plus AI agent / RAG / memory diagrams（架构、微服务、云架构、agent、RAG、记忆、multi-agent、工具调用；非拓扑、非论文）→ `workflows/create.md`, `docs/architecture-diagrams.md`, `docs/agent-diagrams.md`, `docs/design-system/README.md`
• `edit` — modify an existing sidecar bundle or imported `.drawio` → `workflows/edit.md`, `docs/migration-readiness.md`
• `replicate` — redraw an uploaded image, screenshot, SVG, or reference diagram → `workflows/replicate.md`, `docs/design-system/README.md`, `docs/design-system/specification.md`, `docs/design-system/color-guide.md`
• `palette` — palette, colorblind safety, grayscale/black-and-white printing, or multi-category distinction → `docs/design-system/color-guide.md`, `docs/design-system/themes.md`, `docs/design-system/specification.md`, `examples/palettes/README.md`
• `math-formula` — formulas, equations, LaTeX, AsciiMath, MathJax, or Chinese formula keywords → `docs/math-typesetting.md`, `docs/design-system/formulas.md`
• `stencil-heavy` — cloud, AI brand, SysML, BPMN, network gear, or exact draw.io shape work → `docs/stencil-library-guide.md`, `docs/upstream-capability-compati