will-hxw/drawio-diagram-builder-skill — explained in plain English
Analysis updated 2026-05-18
Recreate a figure from a research paper as an editable draw.io diagram instead of a flat image.
Generate an architecture or data-flow diagram automatically from an existing codebase.
Build a machine learning pipeline diagram showing stages, models, and datasets.
Combine written requirements and multiple reference images into one polished diagram, refined through automated screenshot review.
| will-hxw/drawio-diagram-builder-skill | retro-diffusion/pixel-art-fixer | mocasus/auto-freecf | |
|---|---|---|---|
| Stars | 183 | 183 | 186 |
| Language | Python | Python | Python |
| Setup difficulty | moderate | moderate | moderate |
| Complexity | 3/5 | 3/5 | 3/5 |
| Audience | developer | developer | developer |
Figures from each repo's GitHub metadata at analysis time.
Full functionality needs a browser automation tool like Playwright for the screenshot feedback loop.
This project is a skill that can be installed into AI coding agents like Claude Code or Codex, teaching them how to produce editable diagram.net or draw.io diagrams from research papers, written prompts, codebases, or reference images. The goal is publication-quality figures that a person can still open and edit afterward, rather than a flat picture. The core problem it solves is that when an AI is simply asked to write draw.io diagram code, the first attempt is usually flawed: text spills out of boxes, arrows point the wrong way, icons are missing, or reference images get pasted in as flat pictures instead of being redrawn as editable shapes. This skill gives the agent a repeatable process instead: turn the user's text and images into a diagram plan, generate the diagram file, preview it through a local web page, take a screenshot, review that screenshot for visible and logical mistakes, fix them, and repeat until it looks right. It can recreate figures from academic papers, draw architecture or data flow diagrams from an existing codebase, build machine learning pipeline diagrams showing stages and datasets, and combine several reference images with written requirements into one coherent diagram. It ships with a set of MIT-licensed icon graphics useful for common research-diagram symbols like documents, storage, and models. Using it well requires a working Python 3 installation, an internet connection since the preview loads from diagrams.net's embed service, and some form of browser automation tool such as Playwright, so the agent can actually see the screenshots it is reviewing. Without that browser piece, the agent can still generate the raw diagram file but cannot check its own visual work, which the project describes as its main value. It is not affiliated with the official diagrams.net or JGraph products, and it does not promise a perfect result on the first try.
An installable AI agent skill that generates editable draw.io diagrams from papers, prompts, or codebases, using a screenshot review loop to catch and fix layout mistakes.
Mainly Python. The stack also includes Python, draw.io, Playwright.
Permissive open-source license, use freely including for commercial purposes, with attribution.
Setup difficulty is rated moderate, with roughly 30min to a first successful run.
Mainly developer.
This repo across BitVibe Labs
double-check against the repo, no cap.