Customization Studio

Configure Voice Widget

Save your ElevenLabs Agent ID, customize widget UI, and copy an embeddable snippet hosted on /embed.

How to find your Agent ID

Open your ElevenLabs dashboard.
Navigate to Conversational AI and choose your agent.
Copy the Agent ID string from the agent settings.

ElevenLabs Agent ID

Widget UI setup

Use compact layoutShow frame and borderModeMessage styleCorner radiusWidget height (px)

Brand label (status tile)Text input placeholderEmpty state titleEmpty state descriptionAssistant avatar image URL (optional)

Orb primary color

Orb secondary color

Embeddable widget URL

/embed?agentId=agent_5901kbcpgqbef8dsh2qd7p8qhbtp&compact=true&framed=true&rounded=xl&height=600&mode=voice-chat&brandLabel=Customer+Support&textInputPlaceholder=Enter+your+message...&emptyStateTitle=Start+a+conversation&emptyStateDescription=Tap+the+phone+button+or+type+a+message&orbPrimaryColor=%23CADCFC&orbSecondaryColor=%23A0B9D1&assistantAvatarImageUrl=&messageStyle=contained

Copy/paste iframe code

<iframe src="/embed?agentId=agent_5901kbcpgqbef8dsh2qd7p8qhbtp&compact=true&framed=true&rounded=xl&height=600&mode=voice-chat&brandLabel=Customer+Support&textInputPlaceholder=Enter+your+message...&emptyStateTitle=Start+a+conversation&emptyStateDescription=Tap+the+phone+button+or+type+a+message&orbPrimaryColor=%23CADCFC&orbSecondaryColor=%23A0B9D1&assistantAvatarImageUrl=&messageStyle=contained" title="Voice Chat Widget" width="100%" height="600" style="border:0;" allow="microphone"></iframe>