hand atlas

pro

Get the prompt, project and Figma file with monthly ($29 a month) or yearly ($249 a year). Plus tax where it applies.

An anatomy viewer as a self-playing product loop, on an 18.2-second cycle. A dark app window holds a render of a left hand in the middle, a glass specimen panel on the left (Left hand, SPC-2214, adult, dorsal; age, length and span; the layer list with counts; a Labels switch; a build timer; the reviewer, Dr. Mira Okafor) and a glass panel on the right with the layer's metrics, bars, a chart by region and a note. A demo pointer clicks the layer pills under the render: each click wipes the hand up to the next layer, skeleton to ligaments to vessels and nerves to the full network, along a frayed front that glows as it runs from the wrist to the fingertips. The list highlight and the pill slide over, the read-out counts the structures, the right panel's rows lift out and rise back in, its bars fill and its chart grows, and three callouts pop out on the hand with a point, a drawn leader line and a glass chip. The last click wipes back down to the skeleton, so the loop joins up. WebGL2 for the render (four aligned 1280 × 1280 images and one shader), HTML and CSS with React for the rest, Geist and JetBrains Mono, Phosphor icons, a 1080 × 1080 stage that scales to fit any window, and frame-exact rendering (window.__render(t), window.__LOOP, window.__MANUAL). The renders and the avatar are AI-generated; the reviewer and the specimen are fictional.

what you get

prompt
Paste it into Claude, Codex, Kimi or Cursor to rebuild this template. Tested: we rebuild every template from its prompt before it goes live.
project
The Vite + React source code as a .zip, ready to run.
figma file
The editable design as a .fig file to import into Figma.

what's inside

  • anatomy viewer
  • webgl image wipe
  • layer switcher
  • callouts
  • metrics panel
  • bar chart
  • segmented tabs
  • autoplay loop
  • cursor animation
  • frame-exact recorder

stack

  • react
  • vite
  • typescript
  • webgl

fonts

Geist, JetBrains Mono

Free fonts, linked in the prompt.

colors

  • #070606
  • #0C0A09
  • #F3F0EA
  • #ECE5D8
  • #D8C4A2
  • #E2463B
  • #5A84E6

license

With monthly or yearly: personal and commercial work, client projects included. Don't resell or share the template, prompt or files.

read the license