2.11.0
对应仓库当前发布的版本。完整变更请查看 GitHub Releases。
开源项目已核验
架构图生成技能
用一段自然语言描述换一张架构图。支持时序图、数据流图和状态机，可切换深浅色主题并导出高分辨率图片或 SVG。
5881收藏tt-a1i作者2.11.0版本MIT许可证
Skill 概览
画架构图的麻烦通常不在于想不清楚，而在于把想清楚的东西摆整齐。Archify 让你用英文描述系统结构，直接生成一个自包含的 HTML 文件——打开就能看，一键切换深浅色，可以复制 PNG 到剪贴板直接粘进 Slack 或 Notion，也可以导出最高四倍分辨率的 PNG、JPEG、WebP 或矢量 SVG。导出的 SVG 同时带有深浅两套变量，放进 GitHub README 会跟随读者的系统主题，不必再准备两张图。组件可以用 aws.lambda、postgres、redis 这类语义标签描述，它会自动映射到对应的视觉分类。画完之后还能继续用对话调整，比如「加一个 Redis」「把鉴权移到左边」。
核心功能
- 用自然语言描述换架构图，无需掌握绘图工具
- 支持架构、时序、数据流、生命周期等多种图型
- 一键切换深浅色主题，设置跨会话保留
- 导出最高四倍分辨率的 PNG、JPEG、WebP，或矢量 SVG
- 导出的 SVG 自动跟随读者的系统深浅色偏好
- 生成的 HTML 零依赖，发文件即可分享
适用场景
- 给新同事解释系统结构，需要一张能看懂的图
- 写技术文档或 README，需要跟随主题的架构图
- 梳理 CI/CD 流程、审批流或请求调用链
- 讨论中快速画图，边说边改
安装方式
bash
npx skills add tt-a1i/archify -g使用说明
安装后直接让代理使用这个技能，例如「用 archify 画出这个仓库的运行时架构」。生成的是一个自包含 HTML 文件，打开后可切换主题、复制到剪贴板或导出图片。想调整就继续对话，说明要加什么、移动什么或改成什么颜色。
示例工作流
- 安装技能
- 用一段话描述你的系统或流程
- 打开生成的 HTML 查看效果
- 通过对话继续调整布局和配色
- 复制到剪贴板或导出所需格式
更新记录
常见问题
放进 GitHub README 需要准备深浅两张图吗？
不需要。导出的 SVG 同时包含两套颜色变量和 prefers-color-scheme 媒体查询，会自动跟随读者的系统主题，不必再用 picture 标签包两张 PNG。
需要提前准备图标库吗？
不需要。用 aws.lambda、postgres、redis、github-actions 这类语义标签描述组件即可，它会映射到合适的视觉分类。