Real-time audio visualizer for the browser. Give it your microphone, play some music, watch it go.
| Name | Tagline |
|---|---|
| Acid Warp | Loving homage to the classic DOS screensaver |
| Beat Saber | Geometry is sexy |
| Midas | Gunna be gunna be golden |
| Mycelium | Leave a trace |
No build step. No bundler. Just a web server that can serve ES modules.
git clone https://github.com/makesitgood/phoson.git
cd phoson
npx serve .Then open http://localhost:3000 in a browser that supports the Web Audio API (all modern browsers do).
Why a server? ES module imports are blocked by
file://due to browser CORS rules. Any static file server works —npx serve,python3 -m http.server, VS Code Live Server, etc.
Phoson uses the Web Audio API to analyze microphone input in real time, extracting band energies, beat detection, and BPM. Each frame, that data is passed to whichever visualization is active. Vizzes are self-contained JS classes — each owns its own Three.js scene, camera, and post-processing stack.
The full audio API reference and viz philosophy are in HOWTO.md.
See HOWTO.md for the complete BaseViz interface, the audio frame format, and design principles distilled from building the existing vizzes.
To contribute a new viz, see CONTRIBUTING.md.
- Vanilla JS — no app framework
- Three.js for WebGL rendering and post-processing
- Web Audio API (
AnalyserNode) for audio analysis - No bundler required
MIT © Alex Morse — see LICENSE.
