mermaid-skill
将自然语言描述自动转换为各类架构图、流程图等专业图表。
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：mermaid-skill。 它的用途是：将自然语言描述自动转换为各类架构图、流程图等专业图表。 完整的 Skill 内容见：https://321skill.com/skills/mermaid-skill/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“为我们新设计的用户登录系统画一个序列图，包括前端、API网关、认证服务和用户数据库。” 它会自动理解你的需求，生成对应的 Mermaid 代码，校验无误后渲染成清晰的序列图 PNG 文件提供给你。或者你可以说：“把刚才生成的架构图改成竖排布局，并加上 Redis 缓存。” 它会基于你的反馈进行迭代优化。
介绍
mermaid-skill 解决了开发者和技术文档撰写者在沟通、设计、文档化过程中，需要快速、准确地绘制专业图表（如架构图、流程图、类图）的痛点。它允许你直接用自然语言描述图表内容，由 AI 自动生成标准的 Mermaid 代码，并经过语法校验后渲染成 PNG、SVG 或 PDF 格式的图像文件，避免了手动绘图或调整布局的繁琐。
使用方式非常直接：在与 Claude Code、Cursor、Copilot 等兼容的 AI 助手对话中，描述你想要绘制的图表（例如“画一个微服务电商架构图”），该技能会自动触发，生成图表代码并输出最终图像。整个过程无需离开对话界面，也无需手动运行任何绘图工具。
该技能非常适合需要频繁绘制技术图表来沟通设计、编写文档或进行演示的各类技术角色，如软件工程师、架构师、技术文档工程师和项目经理。它极大地提升了从想法到可视化成果的效率。
建议在描述图表时尽量清晰、结构化，例如指明组件、关系和流程。技能内置了视觉自检和迭代优化功能，如果对首次生成的图表布局不满意，可以基于反馈进行多轮调整，以获得更佳的可读性。
核心特点
核心区别在于“验证优先”的工作流和“视觉自检”闭环：它会在渲染前严格校验 Mermaid 语法，确保不输出错误图像；渲染后还能自动读取生成的图片，检查标签裁剪、布局拥挤等问题，并尝试自动修复，最多进行两轮优化。
注意事项
不适合需要高度定制化、精确控制每个元素坐标和样式的复杂专业绘图场景。
常见问题
需要安装 Mermaid 或 Graphviz 吗？
不需要。技能提供本地 mmdc（需 Node）和零安装的 Kroki HTTP API 两种后端，后者仅需 curl 即可使用。
支持哪些类型的图表？
支持流程图、序列图、类图、实体关系图、状态图、甘特图、饼图、Git 图、C4 上下文图、思维导图等 10 多种类型。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/mermaid-skill/raw/index.md 读取 mermaid-skill 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/mermaid-skill/raw/index.md（查看排版版本）