实时 SVG浏览器渲染导出 PNG
Mermaid Preview
编写 Mermaid 语法，并在浏览器工作区预览流程图、时序图、类图、状态图、甘特图和 ER 图。
示例
渲染图表就绪
你的 Mermaid 图表会显示在这里。
使用方法
- 1把 Mermaid 语法粘贴到编辑器。
- 2需要起步模板时选择示例。
- 3预览无误后导出 SVG 或 PNG。
常见场景
架构说明产品流程文档AI 生成图表复核
相关工具
常见问题
Mermaid 预览是在本地运行吗？
是的，Mermaid 渲染器会在工具页按需加载并在浏览器端运行。
支持哪些 Mermaid 图表？
示例覆盖 flowchart、sequence、class、state、gantt 和 ER。
Mermaid Preview 面向需要快速检查图表语法的开发者和技术写作者。工作区把源代码和可视化输出并排展示，方便在提交文档前发现布局问题。
渲染器只在工具页加载，不会拖慢首页。打开 Mermaid 编辑器后可以得到真实 SVG 输出、导出操作和清晰语法错误。
适合 README、架构说明、产品规格、事故复盘以及 AI 生成图表发布前的人审。