Theremin

A gesture-controlled piano that turns hand movements into sound. Wave your hands in front of a webcam and play music — no keyboard, no touchscreen, just air.

The idea was simple: what if you could play a piano by moving your hands in the air, like a theremin, but with the sound of a grand piano?

It uses MediaPipe Hands for real-time hand tracking through your webcam. Your right hand plays notes — pinch to trigger a note in melody mode, or spread all five fingers to play chords. Your left hand controls volume with a pinch-and-slide gesture, and toggles between melody and chord modes with a fist.

The sound comes from Tone.js using sampled Salamander Grand Piano — real piano recordings, not synthesized tones. Nine natural notes from B3 to C5, rendered on a full-screen canvas with particle effects and hand skeleton overlays.

Try it live
Built with
MediaPipe Hands, Tone.js, HTML5 Canvas, vanilla JS
How to use
Open in Chrome on a device with a webcam. Give a thumbs-up to start. Right hand plays, left hand controls volume.
Source
github.com/analogartist/Theremin
Related Exploration
Why Can't I Just Draw Something and Have AI Understand It?