上周需要给客户做方案演示，得画一张 RAG 架构图。换作以前，我得打开 Visio 拖拽半天，最后效果还一言难尽。
这次试了试刚学的 fireworks-tech-graph，对 Claude 说了一句「Draw a RAG pipeline flowchart」，30秒不到，一张专业的 SVG 架构图就出来了。导出 PNG 放到 PPT 里，客户看了问这是用什么画的。
说实话，这个体验有点上头。
这个项目叫 fireworks-tech-graph，是一个 Claude Code 技能，专门把自然语言描述转成可直接发布的技术图表。GitHub 上 3.8k Star，最近更新挺勤快，社区反馈也不错。
今天聊聊这个项目。
先说说这是个啥
fireworks-tech-graph 是一个 Claude Code 技能，可以将自然语言描述直接转换为精美的 SVG 图表，并通过 rsvg-convert 导出高分辨率 PNG 图片。
工作原理很简单：你描述需求，Claude 帮你画图。不需要拖拽，不需要写代码，不需要记 Mermaid 语法。输入中英文描述，输出可发布的 SVG + PNG。
项目内置了 7 种视觉风格，从简洁白底到暗色终端、磨砂玻璃，再到 OpenAI 和 Claude 官方风格，基本覆盖了各种场景需求。（放2个风格的图给大家看看👇🏻）
数据表现怎么样
3.8k Star，329 Fork，对于一个 Claude Code Skill 来说，这个量级挺可观。
| 指标 | 数值 |
|---|---|
| Stars | 3.8k |
| Forks | 329 |
| Watchers | 16 |
| 贡献者 | 8 位 |
这个项目填补了一个空白：Mermaid 适合快速内联图表但不支持自然语言，draw.io 适合手动调整但需要 GUI 操作。fireworks-tech-graph 专注文本描述 → 直接出图这个场景，定位很清晰。
技术层面
技术栈很纯粹，Python 79.1%，Shell 20.9%。
Python 79.1%
Shell 20.9%
安装方式：
# 通过 skills 安装
npx skills add yizhiyanhua-ai/fireworks-tech-graph
# 或直接克隆
git clone https://github.com/yizhiyanhua-ai/fireworks-tech-graph.git ~/.claude/skills/fireworks-tech-graph
依赖要求：
- macOS:
brew install librsvg - Ubuntu/Debian:
sudo apt install librsvg2-bin
功能亮点
用了几天下来，有几个点印象比较深。
7 种视觉风格。这是最让我惊喜的地方。不同的文档风格对应不同的视觉呈现：
| 风格 | 背景色 | 适用场景 |
|---|---|---|
| 1-Flat Icon | #ffffff | 博客、幻灯片、文档 |
| 2-Dark Terminal | #0f0f1a | GitHub README、技术文章 |
| 3-Blueprint | #0a1628 | 架构文档、工程图 |
| 4-Notion Clean | #ffffff | Notion、Confluence |
| 5-Glassmorphism | #0d1117渐变 | 产品展示、演示 |
| 6-Claude Official | #f8f6f3 | Anthropic 风格 |
| 7-OpenAI Official | #ffffff | OpenAI 风格 |
14 种 UML 图类型。Class、Component、Deployment、Package、Sequence、Activity、State Machine 等，常用的基本都有。
AI/Agent 领域模式。这是和其他图表工具拉开差距的地方。项目内置了 RAG 流水线、Agentic Search、Mem0 内存架构、多 Agent 协作、Tool Call 流程等 AI 领域的常见架构模式，用自然语言描述就能生成。
语义形状和箭头系统。项目中每个形状都有语义：LLM 用双边框矩形，Agent 用六边形，Vector Store 用环形圆柱。箭头颜色和虚线样式也编码了含义——写入/读取/异步/循环，一目了然。
40+ 产品图标。OpenAI、Anthropic、Pinecone、Weaviate、Kafka、PostgreSQL 这些常见产品的图标都有，直接能用。
适合谁用
根据我的体验，建议以下几类人重点关注：
方案工程师和架构师。经常需要画架构图，fireworks-tech-graph 能极大提升效率。
技术博主。写文章需要配图，用它生成图表比截图更专业。
AI 应用开发者。RAG、Agent 这些场景的架构图，用它生成最合适。
PPT 制作人员。需要快速出技术架构图，直接导出 PNG 往 PPT 里放就行。
典型使用场景
触发短语很简单：generate diagram / draw diagram / create chart / visualize
实际使用示例：
Draw a RAG pipeline flowchart
Generate an Agentic Search architecture diagram
Draw a microservices architecture diagram, style 2 (dark terminal)
Generate a Mem0 memory architecture diagram, output to ~/Desktop/
生成的图表自动包含泳道分组和层级标注，复杂架构也能清晰呈现。
和同类对比
Mermaid。适合快速内联代码，但语法学习成本高，自然语言支持弱。
draw.io。适合手动精细调整，但需要 GUI 操作，不适合自动化。
fireworks-tech-graph。自然语言驱动，专业视觉输出，适合 AI 时代的技术文档生成。
这个项目填补了 Mermaid 和 draw.io 之间的空白——描述系统，立即获得精美图表。
有什么需要注意的
依赖 librsvg。需要提前安装 rsvg-convert，macOS 和 Ubuntu/Debian 安装方式不同，第一次配置有一点点门槛。
复杂图表需要描述清晰。AI 生成效果依赖描述的清晰程度，模糊的需求可能生成不符合预期的图。
不支持实时协作。这是单次生成，不是 Figma 那样的协作工具。
快速上手
安装：
npx skills add yizhiyanhua-ai/fireworks-tech-graph
# macOS 需要安装 librsvg
brew install librsvg
# Ubuntu/Debian
sudo apt install librsvg2-bin
使用：
Draw a RAG pipeline flowchart
Generate an Agentic Search architecture diagram, style 6 (Claude Official)
支持指定输出路径，默认输出到当前目录。
相关链接
- GitHub：https://github.com/yizhiyanhua-ai/fireworks-tech-graph
- 安装：
npx skills add yizhiyanhua-ai/fireworks-tech-graph
fireworks-tech-graph 解决了工程师画图的老大难问题。3.8k Star 说明这个需求是真实存在的。自然语言驱动的体验很顺滑，7 种视觉风格覆盖了大部分场景，AI/Agent 领域模式的深度支持是它和其他图表工具拉开差距的地方。
适合经常需要画技术架构图的人，能极大提升效率。局限性在于复杂图表需要清晰描述，另外不支持实时协作。
如果你还在手动拖拽 Visio 或写 Mermaid，这个 Skill 值得试试。