Real-time music visualization in the browser

Real-time music visualization in the browser

NextJS / React
With this project I want to enable users to visualize music in real time in the browser. This provides an interesting way to experience music in a different way and can also be used as a visual element for music performances or DJ sets.

Technologies used

I used a number of technologies to make this project work, including:
  • Howler.js: A JavaScript library for controlling audio files in the browser.
  • Butterchurn: A JavaScript library for creating audio visualizations.
  • Next.js: A framework based on React
  • Tailwind CSS: A CSS library with classes that can be quickly used for layout and design purposes.
  • Vercel: A cloud-based hosting service for websites

Examples of the results

Here are a few examples of the kind of audio visualizations that can be created with my project:
Example Music Visualizer

Further links

To learn more about the project and try it out yourself, please visit There you will find more information and instructions on how to use the music visualizer.
Lines of code

About me

I'm a software developer from Germany. I've been working with software development for more than 12 years. I'm passionate about technology and I love to learn new things. I'm currently working as a senior software developer at a company called "Engel & Völkers Technology".

Follow me and find out what I'm working on:

Do you have any questions?Do not hesitate to contact me.