架构图别只会 draw.io：试试 Archify

前段时间分享过 drawio-skill 。它适合把自然语言变成可编辑的 .drawio 文件，后续还能继续进 draw.io 改图。

Archify 走的是另一条路：把图做成一个单文件 HTML 。打开以后可以切深色/浅色主题，可以复制 PNG 到剪贴板，也可以导出 PNG 、 JPEG 、 WebP 、 SVG 。写文档、发技术方案、放 README 、丢到 Notion 或飞书里，都很顺手。

这个项目已经到 2.6.0，GitHub 上有 1.2k+ star 。它更像一个给 Claude 、 Codex CLI 、 opencode 用的 agent skill：你描述系统，它生成一张可交付的技术图。

它适合画什么

Archify 现在主打五类图。

Architecture：系统组件、云资源、数据库、缓存、服务边界、安全组。
Workflow：审批流程、工具调用、 CI/CD 、运维 runbook 、事故响应。
Sequence：API 调用链、鉴权、缓存回源、异步 trace 、服务交互。
Data Flow：数据管线、埋点、 PII 隔离、数据血缘、下游消费。
Lifecycle：订单、任务、部署、 agent run 的状态变化、重试、取消、超时和终态。

它的定位很清楚：帮技术团队把“我脑子里知道系统怎么跑”变成“别人一眼能看懂”。

跟 drawio-skill 怎么分工

drawio-skill 更像“生成可编辑工程图”。你要交给别人继续在 draw.io 里维护，或者团队已经围绕 .drawio 文件协作，用 drawio-skill 很合适。

Archify 更像“生成可发布的技术插图”。它的强项是展示效果、深浅色切换、导出清晰度和单文件分享。尤其是写 GitHub README 、技术博客、方案文档、公众号配图时，省掉很多手动截图和修图时间。

我的用法会很简单：需要后续长期维护的图，优先 drawio-skill；需要马上贴进文章、汇报、 issue 、 README 的图，优先 Archify 。

最快怎么用

仓库里已经打好了标准 skill 包：archify.zip。 Claude 、 Codex CLI 、 opencode 都能用。

Claude.ai 里可以直接上传 zip：

Settings → Capabilities → Skills → + Add → 上传 archify.zip → 打开开关

Claude Code CLI：


# 全局安装，所有项目都能用
unzip archify.zip -d ~/.claude/skills/

# 只给当前项目用
unzip archify.zip -d ./.claude/skills/

Codex CLI：


# 全局安装
unzip archify.zip -d ~/.agents/skills/

# 当前项目安装
unzip archify.zip -d ./.agents/skills/

opencode：

unzip archify.zip -d ~/.config/opencode/skills/

# 或者复用通用 agent skills 目录
unzip archify.zip -d ~/.agents/skills/

workflow 、 sequence 、 dataflow 、 lifecycle 这些类型化渲染器会用到 ajv 做 JSON schema 校验。装完 skill 后，在 skill 目录跑一次：

cd ~/.agents/skills/archify
npm install

没装依赖也能跑一部分能力：渲染器会跳过 schema 校验，布局检查还会继续。生成出来的 HTML 本身没有运行时依赖，发给别人就是一个文件。

直接给它一句话

Web 应用架构：

用 archify 画一张架构图：
- React 前端
- Node.js/Express API
- PostgreSQL 数据库
- Redis 缓存
- JWT 鉴权

微服务架构：

用 archify 画一张微服务架构图：
- React Web + 移动端
- Kong API Gateway
- 用户服务（Go）、订单服务（Java）、商品服务（Python）
- PostgreSQL、MongoDB、Elasticsearch
- Kafka 做事件流
- K8s 做编排

数据流图：

用 archify 画一个 data flow：
Web App 和 Mobile SDK 产生 clickstream events，Edge API 收集事件，Consent Gate 过滤身份信息和 PII，Kafka 承接事件流，Warehouse 存 normalized facts，Feature Store 每日生成 feature vectors，Dashboards 和 ML Model 消费下游数据。

状态机：

用 archify 画一个 lifecycle diagram：
任务从 Queued 开始，Planning 生成计划，Executing 调用工具，Reviewing 做质量检查。Needs Approval 和 Blocked 是等待态；Failed 可重试，Cancelled、Expired、Completed 是终态。