Agent skill · design visual · github

drawio

Generate draw.io diagrams as .drawio files and export to PNG/SVG/PDF with embedded XML

Why this skill is useful

Adds a Node.js export script for generating and exporting draw.io diagrams that the AI wouldn't reliably generate on its own.

What it needs

Requires node installed locally. About 1k tokens when loaded. Last updated 2026-08-07. 37,534 stars on the source repository.

What this skill does

Draw.io Diagram Skill Generate draw.io diagrams as native .drawio files and export them to PNG images that can be embedded in Word documents. How to Create a Diagram 1. Generate draw.io XML in mxGraphModel format for the requested diagram 2. Write the XML to a .drawio file using the create/edit file tool 3. Export to PNG using the bundled export script Bundled Export Script This skill includes drawio-to-png.mjs, a Node.js export script with two rendering backends: 1. draw.io CLI (pixel-perfect, fastest) — used automatically if draw.io desktop is installed 2. Official draw.io viewer in headless browser (pixel-perfect, needs Chromium/Edge) — fallback when CLI is unavailable Usage Skill Folder Contents File Purpose ------ --------- SKILL.md This instruction file scripts/drawio-to-png.mjs Node.js export script (CLI + browser fallback) scripts/package.json Dependencies (puppeteer-core) Supported Export Formats Format Embed XML Notes -------- ----------- ------- png Yes Viewable everywhere, editable in draw.io svg Yes Scalable, editable in draw.io pdf Yes Printable, editable in draw.io Draw.io XML Style Conventions Use these styles for consistent, professional diagrams: Locating the draw.io CLI Try drawio first (works if on PATH), then fall back: Windows: "C:\Program Files\draw.io\draw.io.exe" macOS: /Applications/draw.io.app/Contents/MacOS/draw.io Linux: drawio (via snap/apt/flatpak) CLI Export Command Flags: -x (export), -f (format), -e (embed diagram XML), -b (border), -o (output path).

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills github/drawio

View the source on GitHub

Browse the @skills marketplace