Beauty Diagram icon

Beauty Diagram

Beauty Diagram 是一款在线 Mermaid 和 PlantUML 编辑器,可实时预览文本图表、优化布局,并导出 SVG 或 PNG;还支持 Pro draw.io 工作流及 Obsidian、VS Code 系列编辑器集成。

Beauty Diagram

Beauty Diagram 是什么

Beauty Diagram 是一款在线图表编辑器和美化工具,适用于 Mermaid、PlantUML 以及部分 draw.io 工作流。它面向那些已经用文本编写图表、但又希望在不手动重绘形状或连接线的情况下获得更整洁渲染效果的人。

核心流程很直接:粘贴源码、实时预览、运行 Beautify 重新布局图表,然后将结果导出为 SVG 或 PNG。该网站将产品定位为适合在文档、笔记和演示稿中呈现的精美图表,同时保留可在版本控制工作流中重复使用的源码。

核心功能

带美化功能的实时编辑器

将 Mermaid 或 PlantUML 源码粘贴进去,在浏览器中实时预览,并通过一键 Beautify 重新布局图表,而不会修改你的源码。

多种图表格式

支持 Mermaid、PlantUML 和 Pro draw.io 工作流,让图表保持你已经在使用的格式。

SVG 和 PNG 导出

可将美化后的图表导出为 SVG 或 PNG,网站还说明 Pro 提供 4× PNG 导出且完整 Pro 导出无水印。

基于主题的样式

提供主题切换,因此同一张图表可以针对文档、演示稿或深色模式笔记呈现不同样式,而无需编辑底层代码。

动画预览

包含 subtle、lightning、laser、charge 和 pulse 等动画 SVG 样式,可在不重写图表源码的情况下增加动态效果。

AI 辅助图表创建

支持 AI generate 和 refine 流程,可根据自然语言草拟 Mermaid 或 PlantUML 源码,并继续迭代已有图表。

适用场景

  • 文档图表

    从 Mermaid 或 PlantUML 源码创建或润色流程图和活动图,然后导出更整洁的版本用于文档或演示。

  • 笔记与 Markdown 工作流

    直接在 Obsidian 或 VS Code、Cursor、Windsurf、VSCodium、Gitpod 或 Codespaces 的 Markdown Preview 中美化图表,无需切换工具。

  • draw.io 转文本清理

    在 Pro 中导入受支持的 draw.io 图表,将其转换为基于 Mermaid 的工作流,之后继续使用文本驱动方式编辑。

  • 演示图形

    使用实时预览和 SVG/PNG 导出路径,为演示文稿、PDF 或其他可发布素材制作适合幻灯片的视觉内容。

  • 从提示词起草

    当你想先得到一个基于自然语言的图表草稿,再手动编辑源码时,可以尝试 AI 生成或优化。

Pros and Cons

Pros

  • 支持 Mermaid 和 PlantUML,draw.io 支持在 Pro 中提供。
  • 保留原始图表源码,只改变渲染结果。
  • 提供实时预览和一键 Beautify,适合文本优先工作流。
  • 支持 SVG 和 PNG 导出,适用于网页和演示场景。
  • 提供针对 Obsidian、VS Code 系列 IDE 和 CLI 的编辑器集成。

Cons

  • draw.io 导入仅限 Pro。
  • 无水印分享模式和部分主题需要付费方案。
  • Obsidian 插件的渲染在服务器端完成,因此它不是离线优先工具。

FAQ

如何在 Beauty Diagram 中美化图表?

将 Mermaid 或 PlantUML 源码粘贴到编辑器中,如有需要可先选择一个示例,然后使用 Beautify 重新布局并重新调整样式。随后,编辑器可让你将结果导出为 SVG 或 PNG。

我可以导入 draw.io 文件吗?

可以。网站说明 draw.io 导入仅在 Pro 套餐中提供,导入的流程图或时序图会先转换为 Mermaid 源码,再进行美化。

支持哪些图表格式?

该产品在编辑器中支持 Mermaid 和 PlantUML,Pro 版本还提供 draw.io 工作流。Obsidian 和 VS Code 集成也可渲染 Mermaid 和 PlantUML 区块。

有免费版本吗?

可以。免费层可供偶尔使用,而 Pro 和 Premium 可解锁无水印分享模式及更多主题。定价页面还提供按需付费的一次性点数包。

可用哪些导出格式?

该产品提供 SVG 导出和 PNG 导出,网站也明确提到可输出干净的 SVG 和高清 PNG。SVG 适合屏幕展示,而 PNG 适合演示文稿或印刷工作流。

Quick Facts

类别
图表编辑器和美化工具
主要格式
Mermaid、PlantUML,以及 Pro 版的 draw.io
核心流程
粘贴源码、实时预览、美化、导出
集成
Obsidian、VS Code 系列、CLI
定价模式
免费层、Pro/Premium 套餐,以及一次性点数包
源域名
beauty-diagram.com