Audio Waveform

Animated equalizer bars

Shape comes in four options: rounded, line, dot, or tapered. Mirror mode splits bars from the center outward; turn it off and they rise from the bottom. Edge fade shortens bars toward the sides so the waveform tapers naturally instead of cutting off hard. Each bar gets a two-color gradient — Color A to Color B — with optional glow. Speed and smoothing let you dial it from twitchy to slow and liquid. Bar count goes from 6 to 80, and you can control width, gap, and min/max height. Liquid Glass mode wraps the whole thing in a frosted container: backdrop blur, subtle border, specular highlights. Tint color, blur amount, and border opacity are all configurable. On the Framer canvas or when reduced motion is active, it renders a static CSS fallback instead of the canvas animation.

Animated equalizer bars