Skip to content

Music Box

The bare movement of a music box: a pinned brass barrel plucks a steel comb, tooth by tooth, as the gears turn. Loops perfectly.

3D object, V2 Objects3DSeamless loop, verified408 lines of codev1.0.0

In Machines & clockwork, Music & sound, Craft & heritage

Next: Brass GovernorSurprise me

Music Box preview
Starting live preview…
00:00:00:00 / 00:00:00:01

Live, running the real source at reduced resolution.

Your current settings go with it. Combine several clips and hand them over together from your sequence.

Effect controls

Presets

1

Whole turns of the barrel in each loop.

1
3

Changes the wood grain.

The preview runs the same code your AI receives. These settings travel with the hand-off.

Info

What it is

The heart of a music box laid bare on a walnut base: a brass barrel studded with pins turns slowly, and each pin that comes round lifts the tip of one tooth of a steel comb and lets it go, so the tooth swings and settles (a little exaggerated so the eye can follow it). The pins spell out a tune, repeated every turn. At the end of the barrel a toothed gear spins a pinion and a small fan, and a winding key turns on its own post. Choose the tune (a lullaby, a waltz or rising chimes), the metal of the barrel, plates and gears, how many times the tune plays per loop, and how far the teeth swing.

Reuse it in your own idea

  • Lullaby video: Lullaby, brass, with a soft title and a real recording of a music box.
  • Craft explainer: Waltz, gold, camera drift on.
  • Nostalgic scene: Lullaby, copper, slow, behind a photograph montage.

Which part is reusable

src/music-box.js is the ingredient your AI reuses. demo.js is only the example scene around it, and uses chrome-material only for the demo.

Good to know

  • The teeth swing as rigid levers rather than bending, and their frequencies are scaled for the eye, not for the ear.
  • No sound is produced: the tune is only in the pins.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/music-box.js
Exports
  • createMusicBox({ tune?, finish?, turns?, exaggerate?, seed?, anisotropy? }) => { group, teeth, axisY, notes, steps, update(time, loopSeconds), dispose() }
  • TUNES: { lullaby, waltz, chimes }
  • FINISHES: { brass, gold, copper, silver }
Dependencies (exact)
  • three@0.185.1 (source) — Renderer, geometry and physical metals.
  • chrome-material@1.1.0 (demo) — Studio environment light, backdrop, floor and contact shadow.
  • apw-runtime@1.0.0 (demo) — Demo harness.
How it fits a scene

Coordinates: 1 unit = 10 cm. The base is 9.2 × 7.4; the barrel (radius 1, length 5.4) lies along x at y = 2.1; the comb of 18 teeth lies in front of it towards +z.

Lighting: Physical metals: needs scene.environment; a shadow-casting key light draws the teeth's and pins' shadows on the plate.

Timing: update(time, loopSeconds) is a pure function of time; frames render in any order. The notes list gives the moment of every pluck for syncing sound.

Output
1080×1080, 30 fps, 12 s · procedural (computed from the frame number) · seamless loop — The barrel makes a whole number of turns per loop and each tooth's swing, started by its pin, is measured from the pluck with wrap-around, so the tune and the teeth repeat exactly; the gears turn whole multiples of the barrel and the key turns a whole number of times.
Tested
Rendered 360 frames on 2026-10-06 in Chrome 154.0.8037.97 headless on Linux 7.0.0-38-generic (x64), Node 22.14.0 (WebGL 2 via SwiftShader (software)). Same frame twice from fresh pages: identical. Loop: Frame 0 vs end state (progress 1): mean |Δ| 0.0000, max |Δ| 0 of 255.
Performance
About two hundred meshes built once and one instanced set of pins; only the barrel, the teeth, the gears and the key are reposed each frame. Smooth at 1080p on laptop GPUs. Software WebGL (no GPU) renders slowly.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- music-box/1.0.0 --out my-video.mp4Needs Node 18+, ffmpeg and Chrome/Chromium. Add --params my-settings.json (from Copy settings) for your own settings.
Version
1.0.0 · sha256:3e8aa3a3373e60e2… · other versions: 1.0.1
Files
License
MIT. Copyright (c) 2026 AI Pixel Wizard. Released under the MIT License. See LICENSE in this folder. Third-party: three.js 0.185.1 (MIT). License details
Provenance
Adapted from the owner's threejs-sketches/objects-scenes/music-box-dancer (MIT), rebuilt for AI Pixel Wizard in October 2026 as the bare movement of a music box: a pinned barrel, a stepped steel comb whose teeth are plucked in time with the pins, a gear train with a fan, a winding key, a walnut base, studio light and shadows, an exact loop and the frame/time contract.
BinMore like this

Gyroscope

3D object3DSeamless loop16 seconds

Astrolabe

3D object3DSeamless loop16 seconds

Hourglass

3D object3DSeamless loop16 seconds