Anatomy — 给 Claude Code 用的技术原理图 Skill，生成可交互的等距 3D 图

Anatomy 是一个跑在 Claude Code 里的 Skill，专门用来生成精细、可交互的等距技术原理图。这个软件工具走 MIT 协议，零依赖只用 Node 内置模块，能把一个技术概念变成一个真实可动的物理物体——缓存密钥变成弹子锁，GPU 上下文变成龙门绘图仪。作为一个开源软件，它输出 SVG、WebGL 和 3D 三种图，每张图由几十个小的实体零件组成，在指针和键盘下平滑移动，自己放大检查每个关节。

场景痛点

写技术文档和博客的时候，原理图都是方块加箭头，干巴巴的没人想看。想要一张精美的等距技术图，能动、能拆解、能实时读数，但自己画不出来也找不到现成工具。做AI应用和 Skill工具的人想要的，不是一个画示意图的矢量工具，是一个能让 Claude 把概念变成物理物体、自动建模加渲染加验证的原理图生成器。

主要功能特点

概念变物体

你告诉 Claude 要解释什么技术概念，Anatomy让它发明一个物理物体，这个物体的工作方式就是概念本身。缓存密钥变成弹子锁，只有每个弹子对齐才转。GPU 上下文变成龙门绘图仪，单个打印头访问 16 个工位。

SVG 加 WebGL 加 3D

SVG 是核心，实体等距零件带四色调色，从后往前画，放在带标题提示和实时读数的卡片里。SVG 加 WebGL 用来画线画不出的东西：火焰、排气、水、焦散、灯光、蒸汽、辉光。3D 模式 beta，零件在真三维里转，转盘、手指弯曲、零件断裂掉落，每帧重新投影和着色。这种设计工具级别的精细度，比普通矢量图精美。

可交互加自动验证

图在指针和键盘下平滑移动，悬停拆解成组件。自己放大检查每个关节，跑几何审计：没有东西穿过任何东西，每个末端都在支架上，每个重叠都按深度顺序绘制。

三种输出格式

独立 HTML 页面、单个 SVG 文件（样式内嵌）、React 或 Next.js 组件。浅色和深色主题都支持。

示例丰富加零依赖

内置示例包括猛禽 2 火箭发动机在测试台上拆解成 11 个组件、学校水波槽、密码转盘、千分表、1984 年台式电脑、街机、测试台。零依赖，只用 Node 内置模块，不需要 API key。作为一个开发者工具，它把技术插图从手绘变成代码生成。这种效率工具级别的自动化，比手动画 SVG 快。

简易使用教程

本机装好 Node.js 20.10 以上版本。
it clone 仓库到~/.claude/skills/anatomy。
输入你要解释的概念。
比如 /anatomy explain how a token bucket rate limiter works, interactive。
告诉它图放在哪：独立 HTML、SVG 文件还是 React 组件，浅色还是深色。
生成后打开 HTML 文件看效果，悬停拆解、拖动交互。
想跑验证就 node examples/xxx/build.mjs –audit。
日常用下来写文档做博客插图都在一个 Skill 里，想找类似工具推荐里的 AI工具可以翻酷软趣站。

官方网站

官网访问

GitHub 访问

下载地址

https://pan.quark.cn/s/dfb10b196ebf

https://www.guangyapan.com/s/1957283931783057431_aeWhI5wocgzRgCO6 （光鸭新用户注册福利：永久免费空间：所有新用户注册即可解锁 2TB 永久免费存储空间，无需额外任务或付费）

Anatomy — 给 Claude Code 用的技术原理图 Skill，生成可交互的等距 3D 图

场景痛点