Waveform Activity Bars

A pure-CSS row of pulsing vertical bars (sinusoid-derived heights, staggered animation) that doubles as an active audio-processing indicator and an idle empty-state. Supports agent-state modes (connecting/listening/thinking/speaking), recor.

Library

LocalMode

Framework

React

Type

component

License

MIT

Install

npx shadcn add @localmode/ui/ui/audio/waveform-activity-bars

Files

• apps/ui/registry/localmode/audio/waveform-activity-bars/waveform-activity-bars.tsx
• apps/ui/registry/localmode/lib/utils.ts

Source

https://github.com/LocalMode-AI/LocalMode

Categories

• Audio Visualizer Components
• React Audio Visualizer Components
• Tailwind CSS Audio Visualizer Components
• Animated Audio Visualizer Components
• Media Components
• React Media Components
• Tailwind CSS Media Components
• Animated Media Components

More from LocalMode

• Streaming Speech Panel
• Voice Orb
• Artifact
• Chart Artifact
• Code Diff Viewer
• Data Table Artifact
• Audio Scrub Player
• Mic Selector
• Synced Transcript Viewer
• Transcribed Note Card
• Voice Button
• Voice Comparison Panel