HAND

A human arm from the shoulder to the fingertips, every bone, joint, muscle and nerve, that you can take hold of. Pull a finger and the tendons slide; bend the elbow and the muscles that do it light up. Click anything to find out what it is.

  • bone
  • joint
  • muscle
  • tendon
  • nerve
  • ligament
  • working
Open the model ↓
Building the arm…

This page needs WebGL, and the browser did not provide it.
If that is unexpected, check the console: a 404 on /public/vendor/three/ means the library is not deployed.

What you are looking at

A right arm at adult proportions, built joint by joint. The bones are the frame: humerus, radius and ulna, the eight carpal bones of the wrist, five metacarpals and fourteen phalanges. Every joint between them has its real range of motion, so the model will not do anything your own hand cannot, and the metacarpals sit on the transverse arch of the palm, which is why flexed fingers converge toward the thumb instead of closing in parallel rows. Muscles are drawn from where they start to where they pull: flattened against the bone where they are meat, pale where they turn into tendon, and rebuilt every time the pose changes so the tendons really do slide over the knuckles. The three nerves that run the hand, median, ulnar and radial, follow their real routes, with the musculocutaneous nerve for the muscles that bend the elbow. The flexor and extensor retinacula strap the tendons down at the wrist, the interosseous membrane ties the two forearm bones together, and each fingertip carries its nail.

When anything moves, the muscles that would produce that movement glow orange and are listed along the bottom of the stage, together with the nerves that drive them. Play the poses and watch the flexors hand over to the extensors and back.

It is a teaching model, not a scan: proportions are textbook averages, each muscle is one strand rather than a sheet, and the forearm turns as one piece instead of the radius crossing over the ulna. The point is to see how the parts connect and what each one is for.

How to use it

Drag a fingercurls it: the knuckle, middle and tip joints bend together the way they do in life. Shift-drag spreads it sideways.
Drag the thumbcurls it across the palm. Shift-drag swings it out away from the palm.
Drag the palmflexes and extends the wrist. Shift-drag tilts it toward the thumb or little-finger side.
Drag the forearmbends the elbow. Shift-drag turns the palm up or down.
Drag the upper armaims the shoulder. Shift-drag rolls it.
Drag a joint handlethe glowing spheres and rings at every joint. Up and down for flexion, sideways for the joint’s second movement (spread, tilt, turning). One joint at a time, precisely.
Drag empty spaceorbits the camera; the scroll wheel zooms toward whatever is under the cursor; right-drag or two fingers pan.
Click anythingselects it. It lights up, everything else dims so you can see where it sits, and the panel on the right explains it. Muscles link to the nerves that drive them and nerves to the muscles they supply.
ViewsHand, Arm, Palm, Back and Thumb side buttons along the top; Fullscreen (or press F) takes over the whole screen.
Peelone slider that strips the arm down a layer at a time: skin off, then the upper arm and extensors, the forearm flexors, the hand muscles, the nerves, until only the skeleton and joints are left. The best way to see one layer without the rest in the way.
Layersquick views for skeleton, muscles, nerves or hand only, or switch each group on and off. Muscle and skin opacity sliders let you see through to what is underneath. "Label the main parts" pins names to the big joints, muscles and nerves.
Poseseight common hand positions, or press play to cycle through them and watch which muscles work. Keys 1 to 8 do the same, R resets.

Why this is here

Robo Kyle is about building the equipment people are missing, and a hand is the most complicated piece of equipment most of us own. Before you can build a hand you have to understand which muscle pulls which tendon over which joint, and that is easier to learn by pulling on one than by reading about it.

What comes next

This interface is the first half of a longer plan. The second half is sensors: small electrodes on the forearm that read the muscle signals a person makes when they try to move fingers they no longer have, so that trying to curl the index finger curls the index finger on this page. That means EMG testing can happen at home, on a screen, long before anyone has to build a bionic hand to test against.

For now nothing on this page reads any sensor. It runs on its own, as a demonstration of the interface those sensors will one day drive.

For builders

The page exposes a small API on window.RoboHand so a signal source can move a joint without touching the 3D code. Angles are in degrees and curl is 0 to 1: 

RoboHand.joints()                     // every joint and its degrees of freedom
RoboHand.setJoint('mcp2', 'flex', 45) // index knuckle to 45 degrees
RoboHand.setCurl('index', 0.7)        // curl the index finger 70% of the way
RoboHand.setJoint('wrist', 'flex', -30)
RoboHand.pose('fist')                 // any preset
RoboHand.activity()                   // which muscles are working, 0 to 1
RoboHand.onChange(() => console.log(RoboHand.snapshot()))

Joint ids: shoulder (swing, elev, twist), elbow (flex, twist), wrist (flex, dev), cmc1 (abd, flex), mcp1, ip1, and for the fingers 2 to 5 mcp2…5 (abd, flex), pip2…5, dip2…5. Deep links work too: hand.html?pose=fist&view=arm&select=median. The model itself is plain three.js in /public/hand/hand.js, with every measurement, path and description in /public/hand/anatomy.js; edit that file to correct or extend the anatomy.