What is Audio Visualizer?

See your audio in real time as a waveform, frequency bars, circular spectrum, or scrolling spectrogram. Each display reacts to the music as it plays.

The visualizer pulls audio from a file or your microphone, runs it through a Web Audio AnalyserNode, and draws the frequency or time-domain data on a canvas at 60 fps. Pick waveform, frequency bars, mirrored bars, circular spectrum, or a scrolling spectrogram; set the canvas to widescreen, square, or portrait for any platform; choose a preset or custom background colour; switch colour schemes from orange to rainbow; adjust sensitivity and bar count; grab a still as PNG; or hit the video button to export a WebM clip with the audio already muxed in.

How to use

1. Upload an audio file or use the microphone input
2. Pick a visualization style — waveform, frequency bars, mirrored bars, circular spectrum, or scrolling spectrogram
3. Play the audio and watch the visualization respond in real time

When to use

• Building cover art for a single by screenshotting the bar spectrum at the loudest moment.
• Recording a shareable WebM clip of your track with the synced visualizer for social posts or YouTube uploads.
• Demoing a sound-design student how different EQ moves change a track's spectral shape.

Result

A streamer adds a live audio visualizer to their music stream, showing colorful frequency bars that pulse with the beat.

FAQ

What gives the bars and waveform their colour gradient?

Each scheme maps the frequency or amplitude value to a colour ramp. Rainbow uses HSL across the spectrum, neon hits saturated pink-cyan, ocean stays in blues, monochrome runs greyscale, and orange matches the site palette.

Why does the microphone option ask for permission every time?

The browser blocks access to your mic until you explicitly say yes. Granting it once for the page usually sticks for the rest of the session; if you denied earlier, clear the site's microphone permission in browser settings and reload.

How do I record the visualization, not just a single frame?

Hit the video icon over the canvas to record the live visualization with the audio muxed in as WebM. For files we capture the full track from the start; for the microphone we capture a 30-second clip. The PNG button next to it grabs a single frame if you only need a still.

What does the sensitivity slider actually change?

It scales the amplitude before drawing. Lower values keep the bars contained for loud masters; higher values exaggerate quiet sources like a whisper or an acoustic guitar fingerpicked clean.

Why are there only a few visible bars when I play a pure tone?

A pure sine has one fundamental and a couple of harmonics, so most FFT bins read near zero. That is the spectrum behaving correctly. Try music or speech to see the full bar range light up.

Related Tools