# Anatomy

> A Claude Code skill that turns a one-line idea into an interactive isometric figure of a machine that demonstrates the concept.

Anatomy is an agent skill made by Ryan (@wheresryan22) for Claude Code. Given a one-line idea, it has Claude invent a physical machine whose working embodies the concept and draw it as a live isometric figure built from many small solid parts. The README says it also runs in Antigravity, OpenCode, Codex and MiniMax Code, and the repository lists a v1.1.0 release.

## What It Is

Anatomy is a skill, a folder with a SKILL.md at its root following the Agent Skills format, that generates explanatory figures. Its core rule is that the object is the explanation: instead of boxes and arrows, Claude builds a recognisable machine, such as a bookcase for an LRU cache or a fruit machine for a bloom filter. Each figure sits in a framed card with a title, an interaction hint and a live readout, and every number shown comes from the same small model that moves the parts.

## How a figure gets made

You write the idea rather than the drawing, optionally adding the words interactive, WebGL or 3D. Claude then sizes the request as a Figure, Hero or Epic, collects the true numbers first, invents the object, lists at least forty parts, builds the geometry with the bundled kit, paints back to front, makes it respond to pointer and keyboard, and verifies it with screenshots, close-ups and geometry audits. Output can be a standalone HTML page, a lone SVG file, or React/Next.js components, in light or dark themes.

## Rendering modes and outputs

Most figures are SVG. WebGL shaders add fire, water, caustics and light inside the same isometric camera, and a 3D mode, documented as beta, turns selected parts in true depth. Figures can also be printed as A4 poster, drawing or handout PDFs generated from the same model. The site also documents an anatomy-figures npm package that exposes the collection as React components and custom elements, with five themes and customisable colour tokens.

## Setup path

Install with the skills CLI or by downloading the skill into a skills folder, then invoke it with /anatomy (or $anatomy in Codex). The kit uses only Node built-in modules and needs Node 20.10 or later; the browser checks use Chrome or Chromium. The documented limits include that it is not a chart library, it draws machines and instruments rather than people or maps, and builds are intentionally slow.

## Features
- Turns a one-line idea into an interactive isometric machine figure
- Figures built from dozens to hundreds of small solid parts
- SVG output with optional WebGL shaders
- Beta 3D mode with parts turning in true depth
- Live readouts driven by the same model that moves the parts
- Pointer and keyboard interaction with reduced-motion support
- Printable A4 poster, drawing and handout PDFs
- Light and dark themes with customisable tokens
- Output as standalone HTML, SVG files or React/Next.js components
- Geometry audit and headless Chrome verification scripts
- Collection of 33 live figures
- anatomy-figures npm package with React components and custom elements

## Integrations
Claude Code, Antigravity, OpenCode, Codex, MiniMax Code, React, Next.js, WebGL, Agent Skills

## Platforms
WINDOWS, MACOS, LINUX, API, DEVELOPER_SDK, CLI

## Pricing
Open Source

## Version
v1.1.0

## Links
- Website: https://skills.wheresryan.sh/anatomy
- Documentation: https://skills.wheresryan.sh/anatomy
- Repository: https://github.com/wheresryan22/anatomy
- EveryDev.ai: https://www.everydev.ai/tools/anatomy