README

Anatomy

A Claude skill that explains an idea by building it as a real, working object.Also runs in Antigravity, OpenCode, Codex and MiniMax Code.Crafted, interactive isometric figures with many small precise parts, in SVG, WebGL and 3D.


  
  
  
  
  
  



  
   
  
   
  



  Quick start ·
  Gallery ·
  What it makes ·
  Install ·
  Usage ·
  Examples ·
  How it works ·
  Limits



  


examples/raptor-engine, light theme, firing. The engine and stand are SVG; the plume is a WebGL shader in the same isometric camera.

---

Ask Claude for a figure that explains a technical idea, and Anatomy has it invent a physical thing whose working is the concept. A cache key that skips work when nothing changed becomes a pin-tumbler lock that only turns when every pin matches. One GPU context serving many canvases becomes a gantry plotter whose single print head visits 16 wells.

Then Claude builds that thing out of dozens of small, solid, shaded parts, puts it in a framed card with a title, a hint and a live readout, makes it move calmly under the pointer and the keyboard, and checks its own work by zooming in on every joint. Every number the figure shows comes from the same small model that moves its parts.

 Quick start

sh
npx skills add wheresryan22/anatomy -g


The CLI asks which agents to set up (Claude Code, Antigravity, OpenCode, Codex, MiniMax Code). To skip the question, add -a claude-code, -a antigravity, -a opencode, -a codex, or -a minimax-code.

Then, in Claude Code:

text
/anatomy explain how a token bucket rate limiter works, interactive


For Antigravity, OpenCode, Codex, or MiniMax Code, target that agent: -a antigravity, -a opencode, -a codex, or -a minimax-code. Antigravity, OpenCode and MiniMax Code take the same /anatomy command; in Codex, type $anatomy.

That's it. No API keys and nothing to npm install: the kit uses only Node's built-in modules.

 Gallery


  
    
    
  
  
    raptor-engine: hover to take it apart into 11 assemblies. An audit proves that no pipe passes through anything, at rest, apart and in every frame between.
    ripple-tank: SVG apparatus over two WebGL layers (lamp light and caustics on the paper, reflections in the water) driven by a dispersion and optics model.
  
  
    
    
  
  
    turning-dial: the 3D mode (beta). About 90 parts are re-projected and re-shaded every frame as you drag the dial.
    dial-indicator: the smallest example, about 300 lines. Hover to slide the carriage; the needle reads each block.
  


Every screenshot is the light theme of a page in examples/, captured with the skill's own scripts/capture.mjs and scripts/drive.mjs. The built pages are committed: open any .html in examples/ to try it.

 What it makes

Three kinds of figure. All three share one kit, one camera and one set of craft rules.

| Kind | What it is | Example |
|---|---|---|
| SVG | The core. Solid isometric parts with four-tone shading, painted back to front, in a card with a live readout and eased mot

Top issues

Latest release

Anatomy can now share what it makes. Ask your agent to publish a finished figure and it lands in the community gallery, with its prompt, model, and how long it took.

 Install or update

bash
npx skills add wheresryan22/anatomy


Or download anatomy.zip below and unzip it into ~/.claude/skills. The latest zip is always at https://github.com/wheresryan22/anatomy/releases/latest/download/anatomy.zip

 New

- Publish to the community gallery. Make a figure as usual, then say "publish this figure to the Anatomy community gallery". Your agent asks for a title, an id and your GitHub name, shows exac