LLM Skills
~/catalog/software architecture//SKILL

Drawio skill

/SKILL

Use when the user requests diagrams, flowcharts, architecture diagrams, ER diagrams, UML / sequence / class diagrams, network topology, ML/DL model figures (Transformer/CNN/LSTM), mind maps, or any vi

Agents365-aiAgents365-ai
6.7k
June 20, 2026
MIT License
// skill content

--- name: drawio-skill version: 1.14.0 description: Use when the user requests diagrams, flowcharts, architecture diagrams, ER diagrams, UML/sequence/class diagrams, network topology, ML/DL model figures (Transformer/CNN/LSTM), mind maps, or any visualization. Also use proactively when explaining systems with 3 or more components, complex data flows, or relationships that benefit from visual representation. Best suited when the diagram requires custom styling, a rich shape library, swimlanes, or exportable images (PNG/SVG/PDF/JPG). Generates .drawio XML and exports locally via the native draw.io desktop CLI. license: MIT homepage: https://github.com/Agents365-ai/drawio-skill compatibility: Requires the draw.io desktop app CLI to be in the PATH (macOS /Linux/Windows). The self-check step requires a vision-enabled model (e.g., Claude Sonnet/Opus); it is gracefully skipped if unavailable. Optional auto-layout (scripts/ autolayout.py) requires Graphviz (dot). platforms: [macOS, Linux, Windows] metadata: {"openclaw":{"requires":{"anyBins":["draw.io","drawio"]},"emoji":"📐","os":["darwin","linux","win32"],"install":[{"id":"brew-drawio","kind":"brew","formula":"drawio","bins":["drawio"],"label":"Install draw.io via Homebrew","os":["darwin"]},{"id":"brew-graphviz","kind":"brew","formula":"graphviz","bins":["dot"],"label":"Install Graphviz for optional autolayout.py","os":["darwin"],"optional":true}]},"hermes":{"tags":["drawio","diagram","flowchart","architecture","visualization","uml"],"category":"design","requirestools":["drawio","draw.io"],"relatedskills":["mermaid","excalidraw","plantuml"]},"author":"Agents365-ai","version":"1.14.0"} --- # Draw.io Diagrams ## Overview Generate .drawio XML files and export them to PNG, SVG, PDF, or JPG locally using the native Draw.io desktop app CLI. Supported formats: PNG, SVG, PDF, JPG : no browser automation required. PNG, SVG, and PDF exports support --embed-diagram (-e) : the exported file contains the full diagram XML, so opening it in draw.io restores the editable diagram. Use double extensions (name.drawio.png) to indicate embedded XML. ## When to use / when NOT to use Use this skill for: polished, precise diagrams (architecture, network, strict UML, ERD), anything requiring solid opaque fills, 10,000+ stock or branded shapes, swimlanes, or custom geometry, exported as editable PNG, SVG, or PDF. Do NOT use it:go elsewhere:for: - A casual hand-drawn or whiteboard look → excalidraw or tldraw. - Diagrams-as-code that live in Git or render in Markdown → mermaid (general) or plantuml (UML). - Freeform infinite-canvas sketching or freehand strokes → tldraw. ## Bundled resources When the workflow references one of these, read it on demand : none of them need to be in context up front. | File | Read it when | |---|---| | references/diagram-types.md | The user specifies a specific diagram type (ERD, UML class, sequence, architecture, ML/DL, flowchart) | | references/shapes.md + scripts/shapesearch.py | The diagram requires a specific shape : a cloud icon (AWS/Azure/GCP), Cisco/Kubernetes/network symbol, UML/BPMN/ER/electrical/P&ID element : or any time you’d otherwise expect a style= string. shapesearch.py "<keywords>" returns the exact official style for over 10,000 shapes | | scripts/aiicons.py | The diagram features an AI/LLM brand (OpenAI, Claude, Gemini, Mistral, Llama, HuggingFace, Ollama, LangChain, …) : aiicons.py "<brand>" returns a draw.io-image-style version of the brand logo (lobe-icons via CDN; --embed for inline use). draw.io has no built-in AI logos. See references/shapes.md → "AI / LLM brand logos" | | references/style-presets.md | The user requests to learn, save, list, set as default, or delete a style preset, or you have resolved an active preset and need the application rules | | references/style-extraction.md | You are in the Learn flow and need the extraction procedure (called from style-presets.md) | | references/troubleshooting.md | An export fails, Vision rejects a PNG, or a rendering looks incorrect | | scripts/repair_png.py | After every -e PNG export : fixes draw.io’s truncated IEND chunk (issue #8) | | scripts/encode_drawio_url.py | The CLI is unavailable and yo

// original public source
Agents365-ai/drawio-skill
/skills/drawio-skill/SKILL.md
License: MIT License
Independent project, not affiliated with Anthropic. This skill remains the property of its original author.
// install this skill
Paste this command in your terminal at the root of your project:
mkdir -p .claude/commands && curl -o ".claude/commands/SKILL.md" "https://raw.githubusercontent.com/Agents365-ai/drawio-skill/main/skills/drawio-skill/SKILL.md"
Then in Claude Code, type /SKILL to activate it.
open_in_newOpen original source
// save
Save available after sign in.
loginSign in to save
// information
Stars 6.7k
LicenseMIT License
UpdatedJune 20, 2026
Format.md
AccessFree
// similar

Skills Software architecture

View allarrow_forward