缩放不失真
无论用于小型 README 还是大屏展示,线条、形状和文字都能保持清晰。
可缩放矢量图导出
在线将 Mermaid 源码转换为 SVG,边编辑边预览,并下载适合技术文档、网页、设计工具和版本管理的清晰矢量图。
编辑示例或粘贴自己的 Mermaid 源码,确认预览结果后下载可缩放 SVG 文件。
SVG 以可缩放格式保留渲染结果,适合技术文档、响应式网页和接受 SVG 资源的设计流程。
无论用于小型 README 还是大屏展示,线条、形状和文字都能保持清晰。
将 SVG 用于文档站点、代码仓库、Wiki 和支持矢量资源的设计工具。
修改源码时同步查看渲染结果,并在源码旁直接检查语法反馈。
直接在现代浏览器中使用,无需安装 Mermaid CLI、桌面应用或编辑器插件。
将当前源码带入完整编辑器,继续使用 AI 生成、修复、分享和项目管理。
下载前先验证源码和预览,确保矢量图中的结构、标签和主题符合发布要求。
粘贴 Mermaid 源码,或修改可运行的默认示例。
检查实时预览,并修复编辑器旁显示的语法错误。
选择符合目标文档或网页背景的 Mermaid 主题。
按预期展示宽度检查长标签、交叉连线和图表方向。
点击“下载 SVG”,保存矢量文件。
Mermaid 图表主要由文字和几何图形构成,与矢量输出天然匹配,可在不同显示尺寸下保持可读性。
SVG 不依赖固定像素,响应式页面或高分屏放大后,文字和连接线也不会模糊。
转换器导出当前渲染结果,应先解决语法、裁切和布局问题。
导出的 SVG 会保留主题颜色,应根据最终页面背景选择合适主题。
网页和可缩放文档优先使用 SVG;只支持普通图片或附件上传时使用 PNG。
默认流程图展示从源码、预览到 SVG 下载的转换过程,可替换成任意受支持的 Mermaid 图表。
flowchart LR
Source[Mermaid 源码] --> Render[渲染图表]
Render --> Review{预览正确吗?}
Review -->|否| Source
Review -->|是| Export[下载 SVG]比较图表工作流
比较语法、图表类型、渲染流程和技术文档中的维护方式。
阅读 Mermaid 与 PlantUML 对比 →继续使用通用编辑器,浏览本批工具目录,或用相关建模视角对照当前图表。
粘贴有效的 Mermaid 源码,确认实时预览,然后点击“下载 SVG”保存当前矢量图。
不会。SVG 是矢量格式,线条、形状和文字在不同尺寸下都能保持清晰。
可以转换当前编辑器 Mermaid 版本支持的图表,包括流程图、时序图、类图、ER 图、状态图和甘特图。
不需要,编辑、预览和 SVG 导出都在浏览器中完成。
可以,下载前选择 Mermaid 主题,导出的 SVG 会反映当前渲染主题。
网页和可缩放文档使用 SVG;演示文稿、附件和只接受位图的平台使用 PNG。