Interactive audio-reactive 3D visualizer built with React, ThreeJs, and React Three Fiber, featuring custom Blender assets, playlist mode, real-time controls, and user-uploaded audio support.
the project
Interactive audio-reactive 3D visualizer built with React, ThreeJs, and React Three Fiber, featuring custom Blender assets, playlist mode, real-time controls, and user-uploaded audio support. A built-in ⚙️ settings panel allows users to upload their own music and customize the experience in real time. The visualizer also ships with default audio presets by Cymatics, making it instantly playable out of the box. This project served as a hands-on deep dive into real-time rendering, performance optimization, audio-visual synchronization, and interactive 3D design on the web.
the challenge
The project explores the full 3D pipeline — from modeling and texture baking in Blender to rendering and interaction using React, Three.js, and React Three Fiber. It delivers an immersive, audio-reactive experience where users can freely interact with the scene, enable playlist mode to auto-play visuals, or run everything simultaneously.
Experience the project live here


