drawio

Generate pixel-perfect diagrams from a stencil library using MXGraph XML.

38|3|Updated May 7, 2026
One-click install
npx skills add https://github.com/Chanw-research/claude-code-paper-writing --skill drawio-chanw-research
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: drawio
Source: https://github.com/Chanw-research/claude-code-paper-writing/tree/main/skills/figures/drawio
Command: npx skills add https://github.com/Chanw-research/claude-code-paper-writing --skill drawio-chanw-research

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Create precise, pixel-perfect diagrams quickly using a comprehensive stencil library and the drawio XML format.

Core Features & Use Cases

  • Supports architecture diagrams, network topology, and other complex visuals requiring pixel-perfect layouts and vendor icons.
  • Enables deterministic diagram generation via structured instructions and MXGraph XML.
  • Facilitates sharing and exporting diagrams for documentation and collaboration.

Quick Start

Generate a diagram by applying the included drawio SKILL to compose a chart from the stencils folder.

Frequently Asked Questions about drawio

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

FAQPage Schema
How do I generate pixel-perfect architecture diagrams automatically?▼

To generate pixel-perfect architecture diagrams automatically, define structured instructions and leverage the MXGraph XML format to deterministically compose visuals from a large stencil library. This enforces deterministic diagram generation for precise layouts and vendor icons.

Can I create network topology diagrams using drawio XML?▼

Yes, you can create network topology diagrams using drawio XML by applying structured instructions to the MXGraph format. This approach enforces deterministic diagram generation, ensuring complex network visuals maintain accurate pixel-perfect layouts and vendor icons.

What is the best way to automate diagram generation for engineering documentation?▼

The best way to automate diagram generation for engineering documentation is to use MXGraph XML combined with a comprehensive stencil library. This method enforces deterministic diagram generation, producing complex, pixel-perfect visuals suitable for sharing and exporting.

Does deterministic diagram generation support UML-like diagrams and complex visuals?▼

Deterministic diagram generation fully supports UML-like diagrams and complex visuals by leveraging the MXGraph XML format and frontmatter metadata. This approach applies across engineering and research contexts, ensuring pixel-perfect layouts using an extensive stencil library.

How do I use stencils to compose a chart in drawio?▼

To use stencils to compose a chart in drawio, apply the structured instructions to map visual elements into the MXGraph XML format. This process leverages the 8900+ stencils assets and frontmatter metadata to enforce deterministic, pixel-perfect diagram generation.