elevenlabs-ui

ElevenLabs UI is a component library built on top of shadcn/ui to help you build audio & agentic applications faster.

ElevenLabs UI provides pre-built, customizable React components specifically designed for agent & audio applications, including orbs, waveforms, voice agents, audio players, and more. The CLI makes it easy to add these components to your Next.js project.

You can use the ElevenLabs Agents CLI directly with npx, or install it globally:

# Use directly (recommended)
npx @elevenlabs/cli@latest components add <component-name>
# Or using shadcn cli
npx shadcn@latest add https://ui.elevenlabs.io/r/all.json

Before using ElevenLabs UI, ensure your Next.js project meets these requirements:

• Node.js 18 or later
• shadcn/ui initialized in your project (npx shadcn@latest init)
• Tailwind CSS configured

Install all available ElevenLabs UI components at once:

npx @elevenlabs/cli@latest components add all

This command will:

• Set up shadcn/ui if not already configured
• Install all ElevenLabs UI components to your configured components directory
• Add necessary dependencies to your project

Install individual components using the components add command:

npx @elevenlabs/cli@latest components add <component-name>

Examples:

# Install the orb component
npx @elevenlabs/cli@latest components add orb

### Alternative: Use with shadcn CLI You can also install components using the standard shadcn/ui CLI:

# Install all components
npx shadcn@latest add https://ui.elevenlabs.io/r/all.json
# Install a specific component
npx shadcn@latest add https://ui.elevenlabs.io/r/orb.json

All available components can be found here or explore a list of example components here.

If you'd like to contribute to ElevenLabs UI, please follow these steps:

1. Fork the repository
2. Create a new branch
3. Make your changes to the components in the registry.
4. Open a PR to the main branch.

Please read the contributing guide.

Licensed under the MIT license.

Engineered by ElevenLabs.