Mermaid 转 Unicode 框线艺术 (grok-mermaid)

Simon Willison's Blog 工具
mermaid unicode box-art webassembly rust grok cli

摘要

Simon Willison 使用 WebAssembly 构建了一个基于浏览器的工具，用于将 Mermaid 图表转换为 Unicode 框线艺术，灵感来自 Grok CLI 编码代理的开源 Rust 组件。

暂无内容
查看原文
查看缓存全文

缓存时间: 2026/07/16 01:40

# 工具：Mermaid 转 Unicode 线框艺术（grok-mermaid） 来源：https://simonwillison.net/2026/Jul/16/grok-mermaid/ 2026年7月16日 工具（https://simonwillison.net/elsewhere/tool/）Mermaid 转 Unicode 线框艺术（grok-mermaid）（https://tools.simonwillison.net/grok-mermaid） 在探索新开源的 Grok CLI 编码代理的代码库（https://simonwillison.net/2026/Jul/15/grok-build/）时，我发现了 `xai-grok-markdown/src/mermaid.rs`（https://github.com/xai-org/grok-build/blob/b189869b7755d2b482969acf6c92da3ecfeffd36/crates/codegen/xai-grok-markdown/src/mermaid.rs），这是一个用 Rust 编写的“Mermaid 图表的自包含终端渲染器”。 我想着通过 WebAssembly 在浏览器中尝试这个工具会很有趣。以下是我在 Claude Code for web（Fable 5）中运行的提示（https://github.com/simonw/tools/pull/293#issue-4897479396），最终生成的工具如下图所示： ![Mermaid 图编辑器的截图，显示源代码和渲染后的流程图。代码内容：graph TD Start[请求收到] --> Auth{已验证？} Auth -->|是| Rate{速率限制通过？} Auth -->|否| R401[401 未授权] Rate -->|是| H(处理请求) Rate -->|否| R429[429 请求过多] H -.-> Log[审计日志] H ==> Resp[200 OK]。代码下方有控件：最大宽度：适应输出面板、复制为文本、复制此图的链接。在深色背景上渲染的流程图自上而下：请求收到指向已验证？，从已验证？分支是到速率限制通过？，分支否到401未授权。速率限制通过？分支是到处理请求，分支否到429请求过多。处理请求通过虚线箭头连接审计日志，通过粗箭头连接200 OK。](https://static.simonwillison.net/static/2026/grok-mermaid-wasm.png) 发布于2026年7月16日（https://simonwillison.net/2026/Jul/16/）凌晨12:33

相似文章

Mermaid转ASCII艺术 (mermaid-ascii)

Simon Willison's Blog

一个Web工具，将Mermaid图表语法转换为ASCII和Unicode框线艺术，完全在浏览器中运行，使用编译为WebAssembly的Go库实现。支持流程图、时序图、颜色和可自定义输出。

merman: 无头 Mermaid.js，使用 Rust 实现

Lobsters Hottest

Merman 是 Mermaid.js 的一个无头 Rust 实现，用于解析、布局和渲染图表（SVG、光栅图、ASCII），无需浏览器或 JavaScript 运行时，目标是与 Mermaid.js v11.15.0 功能一致。

@wsl8297: Mermaid 画流程图、时序图确实省事，但默认渲染谈不上好看，更别说在终端里几乎没法用。 我在 GitHub 挖到一个新开源项目：beautiful-mermaid，专门把 Mermaid 的渲染这件事做漂亮、做实用——既能导出精致的 …

X AI KOLs Timeline

beautiful-mermaid 是一个纯 TypeScript 实现的开源工具，能将 Mermaid 图表渲染为精美的 SVG 或终端友好的 ASCII 字符画，支持 15 套主题和零 DOM 依赖，适合在 AI 辅助编程中使用。

Show HN：免费Mermaid图表编辑器

Hacker News Top

一款免费、无需注册的Mermaid图表编辑器，支持实时预览、即时导出SVG/PNG，以及完全在浏览器中运行的分享链接。可选连接GitHub以从源代码自动生成架构图。