skills.rest
d-o-hub
d-o-hubCOMMUNITY
Explore all skills by this author →
GitHub

drawio

Create draw.io architecture diagrams with inline mermaid previews and .drawio XML output.

4|Updated Feb 15, 2026
Search Tags:#documentation#diagramming#visualization#system-design#drawio#architecture-diagrams
One-click install
npx skills add https://github.com/d-o-hub/chaotic_semantic_memory --skill drawio-d-o-hub
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: drawio
Source: https://github.com/d-o-hub/chaotic_semantic_memory/tree/main/.agents/skills/drawio
Command: npx skills add https://github.com/d-o-hub/chaotic_semantic_memory --skill drawio-d-o-hub

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Create clear, shareable diagrams of system architectures, data flows, and module relationships using draw.io.

Core Features & Use Cases

  • Diagram generation for architecture planning and documentation
  • Inline mermaid rendering for quick previews in responses
  • Export and save diagrams as .drawio files to docs/architecture/

Quick Start

Describe the architecture you want and have the assistant generate a .drawio diagram file ready to edit in draw.io.

Frequently Asked Questions about drawio

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

FAQPage Schema
How do I generate architecture diagrams for system design documentation?▼

To generate architecture diagrams, describe your system components and data flows to produce editable .drawio XML files with inline mermaid previews for quick visualization.

What is the best way to visualize module relationships using draw.io?▼

Visualizing module relationships is best done by generating .drawio XML files that map system components and data flows, which can then be edited directly in draw.io.

Can I export draw.io diagrams with inline mermaid previews?▼

Yes, you can export draw.io diagrams with inline mermaid-compatible previews, allowing you to render quick visual previews directly within your responses while saving the full files.

Does this approach save architecture diagrams to a specific directory?▼

Yes, the approach saves generated architecture diagrams as .drawio files directly into the docs/architecture directory to maintain structured system documentation.

How do I document system data flows in a .drawio file?▼

You document system data flows by providing a text description of your architecture, which is converted into a .drawio file visualizing the components and their relationships.

Can I use this to create diagrams for GOAP plans?▼

Yes, you can create diagrams for GOAP plans by generating draw.io architecture diagrams that visualize the plan structure and save the output as editable .drawio XML.

Related Skills

Explore More Software Engineering Skills→
SSiertsemaSSiertsema

context-diagramming

Create Mermaid-compatible system context diagrams with labeled data flows.

Community
Intermediate
YH-05YH-05
1

drawio

Generate native .drawio XML diagrams from natural language descriptions.

Community
Intermediate
adampetrovicadampetrovic
2

mermaid

Validate and render Mermaid diagrams from .mmd files to SVG and ASCII.

Community
Intermediate
keathmilligankeathmilligan

drawio

Generate draw.io diagrams as XML files using mxCell templates.

Community
Intermediate