Labsco
github logo

drawio

✓ Official★ 36,200

by github · part of github/awesome-copilot

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

🔥🔥🔥✓ VerifiedFreeNeeds API keys
#automation#scraping#browser#documents#git
🧩 One of 7 skills in the github/awesome-copilot package — works on its own, and pairs well with its siblings.

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

Inspect the full instructions your agent will receiveExpand

This is the exact playbook injected into your agent when the skill activates — shown here so you can audit it before installing. You don't need to read it to use the skill.

by github

Generate draw.io diagrams as .drawio files and export to PNG/SVG/PDF with embedded XML npx skills add https://github.com/github/awesome-copilot --skill drawio Download ZIPGitHub36.2k

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

  • Generate draw.io XML in mxGraphModel format for the requested diagram

  • Write the XML to a .drawio file using the create/edit file tool

  • 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:

  • draw.io CLI (pixel-perfect, fastest) — used automatically if draw.io desktop is installed

  • Official draw.io viewer in headless browser (pixel-perfect, needs Chromium/Edge) — fallback when CLI is unavailable

Usage

Copy & paste — that's it
# Install dependencies (one-time, from the scripts folder)
cd skills/drawio/scripts && npm install

# Export a single diagram
node skills/drawio/scripts/drawio-to-png.mjs [output.png]

# Export all .drawio files in a directory
node skills/drawio/scripts/drawio-to-png.mjs --dir 

# Force a specific renderer
node skills/drawio/scripts/drawio-to-png.mjs --renderer=cli|viewer|auto

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:

Copy & paste — that's it

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

Copy & paste — that's it
drawio -x -f png -e -b 10 -o

Flags: -x (export), -f (format), -e (embed diagram XML), -b (border), -o (output path).