drawio-diagrams

Create and verify draw.io diagrams from structured specifications with mxGraphModel.

Updated Apr 26, 2026
One-click install
npx skills add https://github.com/MADTeacher/skills --skill drawio-diagrams-madteacher
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: drawio-diagrams
Source: https://github.com/MADTeacher/skills/tree/main/drawio-diagrams
Command: npx skills add https://github.com/MADTeacher/skills --skill drawio-diagrams-madteacher

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a robust workflow to create, edit, structurally validate, QA, and export draw.io diagrams (diagrams.net) from a structured specification, ensuring consistent structure and ready-to-share artifacts.

Core Features & Use Cases

  • Self-contained diagram workflow: build, edit, validate, check layout, and export draw.io diagrams.
  • Structural correctness: guarantees mxGraphModel structure, pages, nodes, edges, and geometry with explicit coordinates and points.
  • Validation and QA: automated layout checks, per-page checks, and export-ready final artifacts for documentation and reviews.

Quick Start

Generate a .drawio file from a specification and run structural validation, layout checks, and exports.

Frequently Asked Questions about drawio-diagrams

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate draw.io diagrams from a structured specification?

You can generate draw.io diagrams by feeding a structured specification into the workflow, which automates the creation of block diagrams, architectural maps, and swimlanes using explicit mxGraphModel geometry for export-ready artifacts.

How does structural validation work for draw.io diagram exports?

Structural validation for draw.io diagrams works by running automated layout and per-page checks against the mxGraphModel structure. This verifies explicit geometry, nodes, and edges to guarantee export-ready final artifacts.

Can I automate non-destructive editing of mxGraphModel diagrams?

Yes, you can automate non-destructive editing of mxGraphModel diagrams by modifying structured specifications instead of manual geometry. This ensures structural correctness is maintained while producing updated, QA-verified draw.io exports.

What is the best way to create data-flow charts and swimlanes in draw.io?

The best way to create data-flow charts and swimlanes in draw.io is by defining them within a structured specification. This automates explicit geometry generation and applies layout checks for consistent documentation.

Do I need external dependencies to verify and export draw.io diagrams?

No, you do not need external dependencies to verify and export draw.io diagrams. The workflow is self-contained, utilizing internal scripts to validate mxGraphModel structure and produce export-ready artifacts.

Why does my draw.io diagram export fail layout validation?

Draw.io diagram exports fail layout validation when the mxGraphModel lacks explicit geometry, valid pages, nodes, or edges. Running automated per-page checks identifies structural issues before generating final artifacts.