Agents365-ai/drawio-skill

Generate draw.io diagrams from natural language — 11 presets (UML, SysML/MBSE, BPMN, network, C4…), 39 tools: codebase/CI/infra-to-diagram, image→editable diagram, Databricks product icons, mind maps, build-up animation, exec-view compression, click-through runbooks, PR diff bot. Vision self-check, 10,000+ shapes. Exports PNG/SVG/PDF/JPG.

What it solves

drawio-skill allows users to generate professional, editable diagrams from natural language, existing codebases, or infrastructure configurations. It eliminates the manual effort of dragging and dropping shapes in draw.io by automating the layout and creation of .drawio XML files, which can then be exported to various image formats.

How it works

The project acts as a skill for AI agents (like Claude Code or Cursor) that interfaces with the native draw.io desktop CLI. It uses a pipeline of extractors and layout engines to turn inputs into structured diagrams:

  • Natural Language: AI agents translate prompts into diagram specifications.
  • Code/Infra Import: Dedicated scripts extract structures from Python, JS-TS, Go, Rust, Terraform, Kubernetes, and docker-compose files, or SQL DDL for ER diagrams.
  • Layout Engine: It utilizes Graphviz for node placement and orthogonal edge routing to avoid overlaps and "hairballs."
  • Refinement: The tool includes a self-check mechanism that reads its own PNG output to auto-fix overlaps and clipped labels.
  • Conversion: It supports converting Mermaid text into native, editable .drawio files.

Who it’s for

  • Software Architects: To visualize complex microservices, cloud infrastructure, and C4 models with drill-down capabilities.
  • Developers: To automatically generate class hierarchies, import graphs, and ER diagrams from their code and database schemas.
  • DevOps Engineers: To turn Infrastructure-as-Code (IaC) files into architecture diagrams using official cloud icons.
  • C4 Model Practitioners: To create multi-page system documentation with linked components.

Highlights

  • Broad Diagram Support: 11 presets including ERD, UML, C4, SysML, BPMN, and Network Topology.
  • Code-to-Diagram: Automatic extraction of project structures from multiple languages and IaC manifests.
  • Cloud Icon Integration: Automatic resolution of official AWS, Azure, GCP, and Kubernetes icons.
  • AI/LLM Brand Logos: Includes 321 logos for modern AI tools (OpenAI, Claude, LangChain, etc.) not found in standard draw.io.
  • Advanced Layouts: Features "Tube-Map Mode" for pipeline journeys and deterministic sequence diagrams.
  • Iterative AI Loop: Supports up to 5 rounds of targeted refinement and visual self-correction.
  • Multi-format Export: Exports to PNG, SVG, PDF, and JPG via the draw.io CLI.

Related

  • Project
    DayuanJiang/next-ai-draw-io

    An AI-powered tool that generates and edits draw.io diagrams using natural language, images, or documents, supporting multiple LLM providers and MCP integration.

  • Project
    yizhiyanhua-ai/fireworks-tech-graph

    An AI agent skill that transforms natural language descriptions into geometry-validated technical diagrams, supporting SVG, PNG, interactive HTML, and semantic GIF animations.

  • Project
    markdown-viewer/skills

    A collection of standardized skills for AI agents to generate professional diagrams, data visualizations, and technical documentation in Markdown.

  • Project
    sparklabx/drawio-ai-kit

    An orchestration and validation framework that enables AI agents to generate structurally precise and standardized draw.io diagrams for cloud architectures.

  • Project
    icebird1998/drawio-scientific-illustrator

    A Codex plugin that enables an AI agent to draw scientific figures live inside the desktop draw.io editor by calling draw.io’s graph API via a local MCP server. It provides tools for launching draw.io, adding shapes/edges, inspecting the canvas, saving the diagram, and exporting to PNG/SVG/PDF. The repo is legacy; active development has moved to the `scientific-illustrator` project.