Overview

What is the Agents embed

The Agents Embed is the fastest way to add an interactive AI agent to any website. Add a single script tag to your HTML and get a fully functional agent with video avatar, voice, and chat capabilities. No backend code, no bundlers, no build steps required.

When to use

You want the quickest integration (minutes)
You prefer no-code or minimal-code solutions
You want a pre-built UI that works out of the box
You need only minimal control / customization options

Customization options

Appearance and Attributes

Change the look and feel through the data attributes of the script

Controls and Methods

Controlling the widget operation and functionality

Events and States

Change the internal state or intercept lifecycle events using callbacks

Display modes

Widget

A floating action button that opens the agent in an overlay. Perfect for adding an agent to existing pages without changing your layout or design.

Compact

A floating window that is overlayed on top of your existing webpage, it can be expanded to full screen mode.

Full mode

Render the agent inside a specific container element you control. Gives you precise placement and sizing while keeping the pre-built UI.

How it works

The embed script loads a lightweight client that connects to your D-ID agent. It handles all the complexity of WebRTC connections, audio/video streaming, and real-time communication with the LLM and avatar services.

---
config:
  theme: redux
  look: neo
---
flowchart LR
    Website(["fa:fa-globe Your Website"]) <--> Client(["fa:fa-link Embed Client"])
    Client --> Agent(["fa:fa-robot D-ID Agent"])
    Agent --> STT(["fa:fa-microphone STT"])
    Agent --> Chat(["fa:fa-comments Chat"])
    STT --> LLM(["fa:fa-brain LLM"])
    Chat --> LLM
    LLM --> TTS(["fa:fa-volume-up TTS"])
    TTS --> Avatar(["fa:fa-user Video Avatar"])
    Avatar --> Client

All configuration happens through HTML data attributes on the script tag. The embed automatically handles initialization, connection management, error states, and cleanup.

Use cases

Customer support Add a support agent to your help center or product pages. Customers get instant answers with a friendly face, reducing support tickets.
Lead generation: Capture leads on landing pages with an interactive agent that qualifies prospects and answers questions before they bounce.
Product demos: Let prospects explore your product through conversation. The agent can explain features, show use cases, and guide users through your offering.
E-commerce assistance: Help shoppers find products, answer sizing questions, and provide recommendations with a personal touch.

Get started

Ready to add an agent to your site? Follow the Quickstart guide to integrate in 5 minutes.