让Claude用自然语言画图！Excalidraw Diagram Generator支持9种图类型

说真的，每次想让 Claude 帮我画个流程图，最后出来的都是一堆 ASCII 字符——箭头歪歪扭扭，方框对不齐，根本没法用。直到我发现了这个 Excalidraw Diagram Generator。

这是一个 Claude Code Skill，只要你用自然语言描述你要的图，它就能生成真正的 Excalidraw 文件。不是什么截图或者静态图，是可以直接拖进 Excalidraw 编辑的 .excalidraw JSON 文件！

支持 9 种图类型，覆盖你所有场景

• 📊 Flowcharts — 流程图、决策树
• 🔗 Relationship Diagrams — 实体关系图、组件依赖
• 🧠 Mind Maps — 思维导图、头脑风暴
• 🏗️ Architecture Diagrams — 系统架构图
• 📈 Data Flow Diagrams — 数据流图
• 🏊 Business Flow (Swimlane) — 跨部门泳道图
• 📦 Class Diagrams — UML 类图
• 🔄 Sequence Diagrams — 时序图
• 🗃️ ER Diagrams — 数据库 ER 图

怎么用？一句中文就搞定

装好之后，直接跟 Claude 说：

“画一个用户注册登录的流程图”
“创建微服务架构图，展示前端、API、数据库的交互”
“用 Excalidraw 画一个 MVI 架构的架构图”

它会自动判断用什么图类型，提取关键元素，生成 JSON 文件。然后你把文件拖进 excalidraw.com，就能看到完整的图，还能继续编辑颜色、布局、加图标。

生成 AWS 架构图也不在话下

这个 Skill 还支持接入 AWS/GCP/Azure 的官方图标库。只要按步骤把图标库配置好，你就能让 Claude 画出专业的云架构图——Internet Gateway、VPC、ELB、EC2、RDS，完整的云架构，一句话搞定。

和其他画图工具比好在哪儿？

PlantUML/Mermaid 得记语法，draw.io 得手动拖拽。而这个 Skill，你只需要描述——”我想要一个展示用户下单流程的图，包含下单、支付、发货三个主要步骤，以及支付失败和缺货两种异常情况”——Claude 就会给你一个完整的流程图。

生成的图还带视觉验证功能（Playwright 渲染管道），Claude 能看到自己输出的图，发现元素重叠、箭头不对齐等问题，自己修复后再给你。

适用人群

• 📝 需要经常画技术文档、架构图的后端/全栈工程师
• 🎨 需要快速出图的项目经理、产品经理
• 📊 需要画 ER 图、流程图的数据库设计者
• 🤖 正在用 Claude Code 做开发的 AI 开发者

快速安装

Claude Code 用户一行命令搞定：

npx skills add github/awesome-copilot --skill excalidraw-diagram-generator --agent claude-code

GitHub 上超过 3 万星，smithery 上 76 次安装，是目前最实用的 Claude 画图 Skill 之一。画图这件事，终于可以说人话了。

⭐ GitHub 仓库：github/awesome-copilot（含 excalidraw-diagram-generator）

GitHub: https://github.com/github/awesome-copilot