画架构图说一句话就出来？这个开源 Skill 让工程师告别手动拖框

画架构图再也不用手画了

你有没有过这种经历——花了两小时在 Draw.io 或 Excalidraw 里拉框框、连箭头，好不容易画完一张架构图，结果产品突然说「这里加个模块」「那个流程改一下」，然后你就得重来一遍。

最近发现一个超好用的开源 Skill，叫 fireworks-tech-graph，专门解决这个痛点——用自然语言描述系统，它就能自动生成专业级技术架构图。

它能做什么？

简单说，就是你在 Claude Code 或 Codex 里跟它说一句话，它就能吐出 SVG 或 PNG 格式的技术图。

支持 12 种视觉风格：平面图标、暗黑终端风、蓝图风、Notion 极简、玻璃态、Claude 官方风格……覆盖了从技术文档到产品演示的各种场景。

支持 14 种 UML 图类型：类图、组件图、序列图、状态机图、用例图……基本上工程师用得到的全齐了。

还有一个特别加分的功能——AI/Agent 专属模式。比如你描述「一个 RAG 检索增强架构」，它会自动生成对应的技术示意图；描述「Multi-Agent 协作流程」，它会画出清晰的多节点交互图。这对于写 AI 相关技术文档的人来说简直是神器。

生成完还能改

最贴心的是它有 验证闭环：生成 → 结构校验 → 视觉检查 → 自动修正。不只是吐一张图就完事了，还会检查你描述的逻辑是不是一致、有没有结构性问题。

另外支持把 SVG 转成 GIF 动图，可以用来展示数据在系统里的流动过程——做 PPT 或技术分享的时候超级加分。

怎么安装？

一行命令搞定：

npx -y skills@1.5.17 add yizhiyanhua-ai/fireworks-tech-graph/skills/fireworks-tech-graph --agent codex claude-code -g -y --copy

或者 Git 克隆也行，具体看 GitHub 主页。

适合谁用？

• 需要快速出技术图的产品经理 / 技术文档作者
• 做系统设计、经常要改图的工程师
• 写 AI / Agent 相关文章、需要配高质量示意图的作者

收藏备用，下次画架构图就不用手动拖框了——说一句话，出来就是能直接用的专业图。

GitHub 仓库直达 →

GitHub: https://github.com/yizhiyanhua-ai/fireworks-tech-graph