再看痛点直击，传统画图的烦恼

• 拖拽组件耗时容易出现错位与重叠。怎么说呢，
• 手动调整布局。线条总是“全乱”，
• 难以将图表纳入版本控制，变更记录不清晰。
• 缺少可复用的主题与风格，视觉统一性差。
• 导出格式有限，无法直接嵌入 Markdown 或 Wiki。

如果你正为这些问题头疼，那么接下来看到的 D2 或许正是你需要的方法。按理说，

D2是一种现代化的文本脚本语言。只需写一段简单文本，就能自动生成漂亮、可维护的架构图。它支持自动布局、主题美化、SVG/PNG/PDF 导出，并集成到 VSCode 与实时预览中。

项目地址：

D2 主要特性一览

• 自动布局这方面，一次定义就可以完成整体排版。
• 说到主题程序。多款官方主题随意切换，支持科技风、深色风、极简风与手绘风等。
• SRC → SVG / PNG / PDF 导出：一键生成多种格式，满足文档需求。
• VSCode 插件：直接在编辑器里编写并实时预览。
• 再看代码版本管理。将 diagram 脚本纳入 Git，实现可追溯变更记录。
• 再看大型程序支持，层级嵌套表达复杂微服务架构。无限制
• 手绘风选项的观点是，轻松建立类似手绘效果的图表，让文档更具亲和力。说起来，

D2 如何安装？

Go 开发者直接安装

go install oss.terrastruct.com/d2@latest
d2 --version

Linux / macOS 一键脚本安装

curl -fsSL https://d2lang.com/install.sh | sh -s --
d2 --version

Windows 安装方式

• Scoop 或 Chocolatey 安装：
Scoop: d7 install d7 d7-cli d7-lang-drawable d7-lang-drawable-core d7-lang-drawable-docs d7-lang-drawable-plugin-syntaxhighlighting d7-lang-drawable-plugin-vscode d7-lang-drawable-me-dark d7-lang-drawable-me-light d7-lang-makefile-syntaxhighlighting d7-language-server-base64-urlencode d7-language-server-cpp c++17 std::filesystem support c++20 std::string_view support c++23 std::span support c++23 std::ranges support c++23 std::bitset support c++23 std::array support c++23 std::chrono support c++23 std::filesystem support c++23 std::filesystem_utf8support c++23 std::locale UTF8UTF16UTF32support c++23std::.utf8_utf16_utf32_support.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll.cplusplus.cpp.core.dll/Scoop: Cocoa: Cocoa : Cocoa : Cocoa : Cocoa : Cocoa : Cocoa : Cocoa : Cocoa :

或下载 Release 包直接使用

第一个 D2 示例

Create a file named hello.d2 with following content:

user -> apiapi -> redisapi -> mysql

A single command will generate an SVG image:

d2 hello.d2
# Produces hello.svg

开启实时预览

d2 --watch hello.d2
# Browser opens automatically and updates on every change.

微服务架构示例

Show Code

Copy Code!

高级玩法与技巧——D 的魔法所在 下面列举了一些高级特性，让你的架构图更具表达力和个性。

自定义 Shape

html db: { 从shape来看，"cylinder" }

数据库节点会自动呈现圆柱体样式。

人物节点

html user: { shape这方面，"person" }

云服务 & 网络结构

支持 AWS、Kubernetes 等云原生组件还有网络拓扑。

多层嵌套

html cloud: { vpc: { subnet: { api } } }

可以直观地表达层级关系。

手绘风格

html vars: { d₂-config: { sketch这方面，true } }

设置 sketch:true 即可开启手绘效果。

主题程序

官方内置多个主题，例如：

makefile 至于me-id，

说到快速切换。

• 科技风
• 深色风
• 极简风
• 手绘风

---

官方示例

以下为官方提供的一张示例图片，可供参考：

---

🎉——从美工到工程师的转变

过去程序员画图像美工，现在程序员画图终于像写代码一样。说起来，D² 正在把 “架构图” 真正带入工程化时代。

如果你的观点是，

• 讨厌拖拽 — 用代码替代鼠标操作。不过，
• 讨厌改布局 — 自动排版一次搞定。
• 想把图纳入 Git — 文这篇文章件天然可版本化。
• 想让 AI 自动生成架构图 — 接口配合就可以。
• 想做真正可维护的程序文档 — 高度可复用、易更新。

那么 D² 比较值得你认真试试。其实，

---