DEV Community

Cover image for Build Voice Agents Faster with ElevenLabs UI Components
jQueryScript
jQueryScript

Posted on

Build Voice Agents Faster with ElevenLabs UI Components

ElevenLabs UI: A collection of open-source agent and audio components built on shadcn/ui to help you build multimodal agentic experiences faster.

Key components:

πŸŽ™οΈ Conversation Bar - Complete voice interface with mic controls and waveform viz

🎨 3D Orb - Three.js animated orb that reacts to audio input

πŸ“Š Audio Visualizers - Bar charts, live waveforms, canvas rendering

πŸ’¬ Message System - Composable chat components with auto-styling

⚑ Streaming Response - Markdown renderer with character-by-character animation

The components install as source files in your project, so you can modify them directly instead of dealing with locked library code. Works with Next.js projects and requires Node 18+.

Installation is straightforward through their CLI or the standard shadcn command. Each component comes with TypeScript support and Tailwind styling.

πŸ‘‰ Blog Post

πŸ‘‰ GitHub Repo

πŸ‘‰ All Components

Top comments (0)