A Three.js music visualizer, running in your browser

Who this is for

• Developers building audio-reactive graphics
• Creative coders
• Students of real-time rendering

What it is made of

Three.js on WebGL2 with half-float HDR buffers, an EffectComposer chain with bloom plus a custom cinema pass for anamorphic streaks and diffraction glints, GPU point clouds with procedural sprites, and fragment-shader ray marching rendered at a tiered internal resolution.

The audio contract

Seven perceptual bands with smoothed and raw twins, separate kick, snare and hat onsets, riser and drop detection, tempo and beat phase, a 64-band log spectrum and a 512-sample waveform. Scenes bind geometry to these rather than to overall loudness.

The part most visualizers miss

Above reactivity there is a structure layer: which register is carrying the track right now, where the four-bar phrase is, and a budget for how much of the scene may move. That is what stops every element twitching at once.

How to do it

1. Open Galaxy — it runs in the browser on WebGL
2. Choose a song or play the demo
3. Pick a cosmic scene and add your logo or title
4. Record, or export an MP4 at 1080p–4K