drawio-skill  by Agents365-ai

Text-to-diagram generation for AI agents

Created 1 month ago
712 stars

Top 47.8% on SourcePulse

GitHubView on GitHub
Project Summary

Summary

This skill addresses the challenge of generating professional diagrams from natural language descriptions, integrating seamlessly with AI agents. It targets developers and researchers needing to visualize complex systems, offering automated diagram creation and export to multiple formats, thereby enhancing documentation and communication.

How It Works

The skill translates natural language prompts into .drawio XML files, leveraging the draw.io desktop CLI for exports to PNG, SVG, PDF, and JPG. It features six specialized diagram presets (ERD, UML, Sequence, Architecture, ML/DL, Flowchart) with tailored styles and layouts. Novel aspects include animated connectors (flowAnimation=1), ML model diagrams with tensor shape annotations, and grid-aligned layouts for precision. A key differentiator is its iterative design loop, enabling preview, feedback, and auto-fixing of up to six common issues via model vision, followed by auto-launching the draw.io desktop app for manual refinement.

Quick Start & Requirements

The primary prerequisite is the draw.io desktop application, installable via Homebrew (brew install --cask drawio on macOS), direct download (Windows/Linux), or package managers. Linux headless exports require xvfb (sudo apt install xvfb and xvfb-run -a). Installation into AI agent environments involves cloning the repository into platform-specific skill directories (e.g., ~/.claude/skills/drawio-skill for Claude Code, ~/.agents/skills/drawio-skill for OpenAI Codex). Browser fallback generation requires Python 3. Links to draw.io desktop releases: https://github.com/jgraph/drawio-desktop/releases.

Highlighted Details

  • Automated Self-Correction: Implements a 2-round auto-fix mechanism by analyzing exported PNGs with model vision, correcting common diagram issues before user review.
  • Specialized Diagram Presets: Offers six distinct presets (ERD, UML Class, Sequence, Architecture, ML/Deep Learning, Flowchart) with pre-defined shapes, styles, and layout conventions.
  • ML/DL Diagram Support: Generates diagrams for ML/DL models, including tensor shape annotations (B, C, H, W) and layer-type color coding, suitable for academic publications.
  • Multi-Agent Compatibility: Designed as a pure SKILL.md solution, it integrates with six major AI agent platforms (Claude Code, Opencode, OpenClaw, Hermes Agent, OpenAI Codex, SkillsMP) without requiring additional servers or complex setups.
  • Advanced Layout & Export: Features production-grade layout with grid alignment, complexity-scaled spacing, routing corridors, and animated connectors. Includes a browser fallback to diagrams.net URLs and auto-launch of the desktop app post-export.

Maintenance & Community

The project is maintained by Agents365-ai. Updates are auto-checked on first use per conversation via git pull --ff-only, with package manager installs handling their own updates. No specific community channels (Discord, Slack) or roadmap links are provided in the README.

Licensing & Compatibility

The project is released under the MIT license, which is permissive and allows for commercial use and integration into closed-source projects without significant restrictions.

Limitations & Caveats

Headless diagram export on Linux servers necessitates the xvfb package for display virtualization. The browser fallback export mechanism relies on Python 3 for data compression. The self-check feature's auto-fix capability is dependent on the AI model's vision support; models lacking vision will skip this step. Current cloud icon support is limited to basic AWS resources, excluding GCP, Azure, and Kubernetes. The source .drawio file for the provided microservices example diagram is not included.

Health Check
Last Commit

20 hours ago

Responsiveness

Inactive

Pull Requests (30d)
2
Issues (30d)
6
Star History
630 stars in the last 30 days

Explore Similar Projects

Feedback? Help us improve.