Live Audio Reactive Screensaver
The Live Audio Reactive screensaver shows real bars and waveforms driven live by your actual microphone input, with your permission. It is free, runs in your browser, and ESC exits.
Live preview
Press ESC to leave fullscreen. Settings are saved in your browser only.
How the Live Audio Reactive screensaver works
After you click to allow it, the saver reads real live audio from your microphone using the Web Audio API.
A real frequency analysis (FFT) drives a bank of bars, and real waveform samples drive a scrolling trace.
All processing happens locally in your browser — no audio is ever recorded, saved, or sent anywhere.
The microphone is released the moment you leave the saver.
Turning sound into bars and waves
Sound reaches a microphone as tiny, rapid changes in air pressure, and the device converts them into a stream of numbers called samples. Plotted over time they make a waveform, the wavy trace that shows the signal at each instant. In the Web Audio API, an AnalyserNode’s getByteTimeDomainData() copies the current waveform into an array, where a value of 128 represents silence. A loud clap makes a tall spike, and a steady hum makes a regular oscillation.
The bars show something the waveform hides: which frequencies are present. The same AnalyserNode uses a Fast Fourier Transform, with its fftSize setting controlling the size, to break a short slice of sound into its component frequencies. Its frequencyBinCount is half the FFT size, and the bins run from the lowest frequency to the highest. Low notes fall in bars on the left and high ones on the right, so a bass drum lights the left side while a whistle appears far to the right.
A few things affect what you see. Browsers offer echo cancellation, noise suppression and automatic gain control as constraints on microphone input, and when they are applied they change quiet or steady sounds. The analyser also averages with the previous frame through its smoothingTimeConstant, and it maps decibel values between minDecibels and maxDecibels onto a 0 to 255 byte range. The result is a picture of the room’s sound, not a measurement calibrated in decibels.
A worked example
Clap once and a real sharp spike ripples across the bars and waveform instantly, exactly matching the real sound just picked up by your microphone.
Settings & tips
- Accent recolours the bars and waveform.
- No audio is ever recorded or sent anywhere — it is processed locally, live.
- You must explicitly click to grant microphone access.
Frequently asked questions
- Is my audio recorded or uploaded?
- No — audio is analyzed live in your browser only, never recorded, saved, or sent anywhere.
- Is a key needed?
- No — it uses your browser's own Web Audio API.
- What if I decline microphone access?
- The saver simply shows a message instead — nothing else changes.
- Is it free?
- Yes — free, no download, in your browser.
- Why are the low frequencies on the left?
- The analyser returns frequency data ordered from the lowest frequency to the highest, and the saver draws them left to right, so bass sits at one end and treble at the other.
- Why does silence still show small movement?
- Rooms are rarely completely quiet, and microphones and electronics add a faint background noise, so the analysis usually finds a little energy at some frequencies.
- Can this tell what a sound is?
- No. It only shows how energy is spread across frequencies. Recognising speech or music would need much more analysis than a spectrum display provides.