Dev Design LibraryTailwind CSS Audio Visualizer Components
Dev Design Library indexes 37 Tailwind CSS audio visualizer components from 15 open-source UI libraries, with the most coming from Watermelon UI, audiocn, Amicro Micro Transitions, LocalMode and OpenSourceUI. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list styles its components with Tailwind CSS utility classes. Audio visualizer components belong to the Media group.
Comp 266Origin UI · React- Voice GlowLibraries.dev · ReactSound-reactive glow for React — a centered, colorful beam along the bottom edge that rises and blooms with voice…
Apple EqualizerAmicro Micro Transitions · ReactApple Equalizer loading animation.
AI VoiceKokonut UI · ReactVoice input with a scrolling waveform, then a take you can play back, discard or send.
Voice InputSpectrum UI · ReactA voice recorder pill with animated level bars and a live timer.
Audio Recorder WidgetOpenSourceUI · React
Bars ThemeNexvyn UI · ReactA traveling-wave bars visualization with 5 vertical bars sharing a sine-wave frequency, evenly phase-shifted left to…
Bar Visualizeraudiocn · ReactA row of bars driven by frequency bands, with idle, loading and mirrored modes. Bars paint without re-rendering React.
Phosphor Score23rd.dev · ReactVertical sheet music on a CRT phosphor: notes fall, bloom at the playhead, then exit in a flare.
Audio Player With WaveformWatermelon UI · React
Now PlayingUI Lab · ReactA listening-to pill whose record slides out from behind the cover and spins while it plays.
Streaming Speech PanelLocalMode · ReactA streaming-TTS status surface: active state (WaveformActivityBars + spinner, synthesizing/playing label…
Voice Chat WidgetSpaceUI · ReactAn expandable voice chat pill with participant avatars, animated speaking indicators, and a smooth pill-to-panel…
Voice MemoFibo · ReactAn aluminium recorder that writes down what you say, with the transcript filling in beside it as you talk.
AI Voice 01ReactFrame · ReactA voice-assistant pill with a canvas audio-reactive visualizer, idle/listening/speaking states, a glowing edge ring…- Voice RingLibraries.dev · ReactVoice-reactive ring of light for React: a glassy spectrum that bends with the voice, takes the colour of its emotion…
Apple Sound WaveAmicro Micro Transitions · ReactApple Sound Wave loading animation.
Recorder Face WidgetOpenSourceUI · React
Electric Bar Visualizeraudiocn · ReactFrequency-band bars drawn as crackling filaments, with arcs between loud neighbours and sparks on sudden rises. Takes…
Transcribe Voice MessageWatermelon UI · React
Waveform PlayerUI Lab · ReactInks in a podcast's waveform, with chapter markers and a ghost playhead.
Voice OrbLocalMode · ReactAn animated Canvas 2D voice-agent orb/visualizer that reflects discrete agent states…
AI Voice 05ReactFrame · ReactA portrait voice-assistant card with a canvas audio-reactive curve visualizer, a mic button that grows on tap…
Siri WaveAmicro Micro Transitions · ReactSiri Wave loading animation.
Electric Waveformaudiocn · ReactOne electric line across the width: a crackling, white-hot trace with a tall glow, forks off the peaks and sparks…
Voice NoteWatermelon UI · React
Waveform Activity BarsLocalMode · ReactA pure-CSS row of pulsing vertical bars (sinusoid-derived heights, staggered animation) that doubles as an active…
Stroke WaveformAmicro Micro Transitions · React
Live Waveformaudiocn · ReactA canvas waveform of a live signal: scrolling level history or the current frame, as bars, a mirrored shape or a line.
Voice Note BaseWatermelon UI · React
Smooth Waveformaudiocn · ReactOne clean line across the width that follows the sound, as a smooth wave shaped by the frequency bands or a triggered…
Voice TranscribeWatermelon UI · React
Spectrumaudiocn · ReactA frequency spectrum analyser drawn on canvas as bars, a line or an area, with peak hold, a grid and frequency and…
Voice Transcribe BaseWatermelon UI · React
Waveformaudiocn · ReactA static waveform of a clip with a smooth playhead, seeking by pointer and keyboard, hover time, draggable regions and…
Waveform ScrubWatermelon UI · React
Waveform Scrub BaseWatermelon UI · React
Libraries with Tailwind CSS audio visualizer components
Related categories
- Audio Visualizer Components
- React Audio Visualizer Components
- Animated Audio Visualizer Components
- Tailwind CSS Media Components
- Tailwind CSS Image Components
- Tailwind CSS Icon Components
- Tailwind CSS Gallery Components
- Tailwind CSS Illustration Components
- Tailwind CSS Mockup Components
- Tailwind CSS Animated Icon Components
- Tailwind CSS Logo Components
- Tailwind CSS Scene 3D Components
- Tailwind CSS Video Player Components
- Tailwind CSS QR Code Components
- Tailwind CSS Icon Set Components
- Tailwind CSS Image Compare Components