在线创建图表

免费使用 Mermaid 在线编辑器,输入代码就能生成流程图、时序图和 ER 图,边写边预览。提供模板和示例,支持导出 PNG、SVG、PDF,也能用链接分享,无需安装。

免费的 Mermaid 在线绘图工具

Mermaid 在线编辑器,写代码就能画图

粘贴 Mermaid 代码,或选一个模板开始。流程图、时序图和 ER 图会随代码实时更新,画好后可以导出 PNG、SVG、PDF,或把链接分享给别人。

  • 完全免费
  • 支持 33 种图表
  • 浏览器端处理
  • 4 种导出格式

画图、预览、导出,在这里就能完成

写技术文档、整理业务流程或做课堂演示,都可以从一段 Mermaid 代码开始。

实时预览

代码一改,图表就跟着更新,方便检查语法和布局。

模板和示例

从流程图、时序图、ER 图或甘特图模板开始,改改文字就能使用。

支持 33 种图表

除了常见的流程图和思维导图,还支持 C4、桑基图、看板等图表。

导出图片、PDF 和源码

下载 PNG、SVG、PDF,或保存 MMD 源码,下次接着编辑。

用链接分享

生成一个链接,让同事或同学打开同一张图。

在浏览器里编辑

图表代码由浏览器处理,编辑和导出无需上传源码。

支持 11 种语言

可以在中文、英语、日语等 11 种界面语言之间切换。

像代码一样管理图表

图表也是文本,方便复制、修改、代码评审和用 Git 管理。

三步画好一张图

  1. 01

    写代码或选模板

    粘贴 Mermaid 代码,或者选一个模板,替换成自己的内容。

  2. 02

    边写边看效果

    调整节点、连线和文字,预览区会实时更新。

  3. 03

    保存或分享

    下载图片、PDF 或 MMD 源码,也可以生成分享链接。

流程图、时序图、ER 图等 33 种图表

从流程图、时序图、ER 图到甘特图、思维导图,按你要表达的内容选择。

  • 流程图
  • 类图
  • 时序图
  • 实体关系图
  • 状态图
  • 思维导图
  • 架构图
  • 块图
  • C4 架构图
  • Cynefin 框架图
  • 事件建模图
  • 甘特图
  • Git 图
  • 鱼骨图(因果图)
  • 看板
  • 数据包图
  • 饼图
  • 象限图
  • 雷达图
  • 铁路图(ABNF)
  • 铁路图(EBNF)
  • 铁路图(IR)
  • 铁路图(PEG)
  • 需求图
  • 桑基图
  • 时间线
  • 树视图
  • 矩形树图
  • 用户旅程图
  • 维恩图
  • Wardley 地图
  • XY 图
  • ZenUML 时序图

为项目、文档和课堂画图

软件开发者

绘制 API 调用、服务交互、数据模型、状态流转、Git 分支、网络数据包和系统架构。

产品与项目团队

梳理用户旅程、业务流程、路线图、看板、时间线、需求和项目计划。

技术写作者

为 README、知识库、规格说明、教程和内部文档创建可维护的图表。

学生与教师

解释复杂系统、对比概念、整理思路,并把笔记快速转化为清晰图示。

图表怎么保存?选一个合适的格式

下载后直接放进文档或演示稿,也可以保存源码,方便下次继续改。

PNG
适合演示文稿、办公文档、聊天工具和快速分享的高清位图。
SVG
可无限缩放的矢量格式,适合网页、设计工具和精细编辑。
PDF
适合打印、报告、评审和长期归档的通用文档格式。
MMD
保留原始 Mermaid 代码,便于后续编辑、复用和版本管理。

代码在你的浏览器里处理

编辑和导出图表时,Mermaid 代码由浏览器处理,无需上传到服务器。分享链接包含图表内容,请只发给你愿意分享的人。

常见问题

这个 Mermaid 在线编辑器真的免费吗?

是的。编辑器、模板、示例、实时预览、链接分享以及 PNG、SVG、PDF、MMD 导出均可免费使用。

Mermaid 是什么?

Mermaid 用文本描述图表。写出节点和它们之间的关系,就能生成流程图、时序图等,不用手动摆放每个图形。

支持哪些 Mermaid 图表类型?

支持 33 类图表,包括流程图、类图、时序图、ER 图、状态图、思维导图、架构图、C4、甘特图、Git 图、看板、桑基图、时间线、用户旅程图、维恩图、Wardley 地图、XY 图、ZenUML 等。

可以导出 PNG、SVG、PDF 和 MMD 吗?

可以。PNG 适合日常图片使用,SVG 适合无损缩放,PDF 适合打印和正式文档,MMD 用于保留可继续编辑的 Mermaid 源码。

Mermaid 代码会上传到服务器吗?

网站按浏览器端处理方式设计,正常编辑与导出过程中,工作数据保留在客户端。

链接分享怎么使用?

在编辑器中生成分享链接并发送给他人,对方即可通过浏览器打开对应图表。

需要安装 Mermaid 或其他软件吗?

不需要。本工具直接在现代浏览器中运行,打开网站即可开始编辑。

可以从模板或示例开始吗?

可以。模板和示例既能帮助学习 Mermaid 语法,也能快速创建常见图表。

可以粘贴 ChatGPT、Claude 等 AI 生成的 Mermaid 代码吗?

可以。粘贴代码后,通过实时预览检查结果,修正可能的语法问题,再导出或分享最终图表。

为什么选择 Mermaid,而不是拖拽式画图工具?

文本图表修改更快、复制更方便,适合 Git、代码评审和文档协作,也更容易与实际系统保持同步。

从一段代码开始画图

打开编辑器,试试模板,或者直接粘贴你的 Mermaid 代码。

开始画图