使用步骤
- 从「插入模板」里选一种图表开始，或者直接粘贴已有的 Mermaid 代码。
- 修改左侧代码，右侧会在停顿后自动重新渲染；语法有误时下方会显示错误信息。
- 选择主题，然后下载 SVG、PNG，或复制 SVG 代码。
参数说明
- 图表类型
- 模板包括流程图、时序图、类图、状态图、ER 图、甘特图、饼图、思维导图；Mermaid 支持的其他类型（如时间线、象限图、Git 图）也可以直接写。
- 主题
- 默认、中性、深色、森林四种内置主题。中性主题接近黑白，适合打印。
- 导出
- SVG 为矢量图，可以无损缩放；PNG 按 2 倍分辨率导出并带底色，适合聊天软件和 PPT。
流程图语法速查
flowchart LR
A[矩形] --> B(圆角)
B --> C{菱形判断}
C -->|是| D[(数据库)]
C -.->|否| E((圆形))TD从上到下，LR从左到右-->实线箭头，-.->虚线箭头，==>粗箭头，-->|文字|带文字
常见问题
Mermaid 代码能直接放到 GitHub 里吗？
能。在 Markdown 文件、Issue 或评论里写成 ```mermaid 代码块，GitHub 会自动渲染成图表。GitLab、Notion、Obsidian、Typora 等也支持。
中文会乱码吗？
不会，节点文字可以直接写中文。导出 PNG 时使用系统已安装的字体。
代码会上传吗？
不会。Mermaid 在浏览器中渲染，图表和代码都不离开你的设备。
为什么节点里的 Markdown 格式没有生效？
为了能导出 PNG，这里用 SVG 文本渲染节点标签，不支持 HTML 标签和部分富文本格式。
隐私说明
本工具完全在浏览器中运行，文件和文本都在你的设备上处理，不会上传到我们的服务器。