next-ai-draw-io
Draw and edit draw.io diagrams by chatting with an AI. Web app, desktop app, and an MCP server for Claude Code, Cursor, Codex and VS Code.
Next AI Draw.io
Draw and edit draw.io diagrams by chatting with an AI.
Live Demo · Docs · Gallery · Desktop App · MCP Server
https://github.com/user-attachments/assets/66b9f12f-219f-4d62-acc0-0725e6850eec
Describe a diagram in a sentence and the AI draws it on a real draw.io canvas. Edit it by hand like any draw.io file, or select a few shapes and tell the AI what to change. Every AI change is a version you can compare, restore or undo, and the result exports as .drawio, .png or .svg.
Available as a web app, a desktop app for Windows, macOS and Linux, and an MCP server for AI agents such as Claude Code, Cursor and VS Code.
Highlights
Draw
- Architecture diagrams, flowcharts, sequence diagrams and more from one sentence, with built-in AWS, Azure, GCP and Kubernetes icon libraries
- Connectors can carry a flowing animation
- Upload a screenshot or a sketch and the AI redraws it; upload PDF, Markdown, code and other text files and get a diagram of their content
Edit
- Edit by chat: changes stream onto the canvas and the shapes the AI just changed are highlighted
- Ask about a selection: select shapes on the canvas and the AI changes only those
- Versions and undo: every AI change is a version card with a thumbnail; compare it with the canvas, restore it or undo it, and Ctrl+Z on the canvas also takes back an AI change in one step
- It is a normal draw.io diagram: double-click to rename, drag, restyle, use several pages, and export as
.drawio,.png,.svgor.drawio.svgat any time
Use
- 25 model providers, including an OpenAI-compatible preset for any other URL; enter your own API key in the browser and it stays on your machine
- Models that reason show their thinking
- Dark mode; the interface is available in English, Simplified Chinese, Traditional Chinese and Japanese
Examples
같은 카테고리 다른 리소스
Next.js
React 기반 풀스택 프레임워크. App Router와 서버 컴포넌트(RSC)가 사실상 표준이며, SSR·SSG·ISR을 한 프로젝트 안에서 다룬다.
shadcn/ui
복사·붙여넣기 방식의 React 컴포넌트 모음. npm 의존성이 아닌 코드 소유권 모델이라 커스터마이징이 자유롭다.
Supabase
PostgreSQL 기반 BaaS. Auth · Realtime · Storage · Edge Functions 통합.
Anthropic MCP
Claude가 외부 도구/데이터에 접근하도록 해주는 프로토콜 표준. 생태계의 근간.