drawio-diagram

Installation
SKILL.md

Draw.io Diagram

Produce a valid, readable native .drawio file. Native XML is the source of truth and remains beside any export. This skill exists for draw.io compatibility and editability; a generic technical diagram belongs to technical-diagram.

Quick path

  1. Form the reader brief in the content contract below. Reduce the source to one question and one answer before choosing cells.

  2. Derive the required nodes, edges, groups, and annotations from that brief. Read references/local/editorial-principles.md and references/local/editorial-default-style.md unless the user supplied a different style or an existing file already establishes one.

  3. Read references/local/upstream-drawio-rules.md. Start with uncompressed bare mxGraphModel XML unless pages or file metadata require <mxfile>.

  4. Read references/local/auto-layout.md and apply the simplest suitable automatic layout. Preserve explicit semantic grouping.

  5. Run both validators from the skill root:

    python3 scripts/validate_drawio_xml.py <file>.drawio
    python3 scripts/validate_drawio_layout.py <file>.drawio
    
  6. For every new diagram or substantial visual edit, export and inspect SVG or PNG when an exporter is available. Apply references/local/review-loop.md. If automatic layout leaves a collision or ambiguous route, read references/local/edge-routing.md, fix only those routes, and validate again.

Installs
6
First Seen
Aug 4, 2026
drawio-diagram — gigio1023/gigio-figures