> ## Documentation Index
> Fetch the complete documentation index at: https://docs.itellico.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Web Widgets

> Create and manage embeddable voice AI widgets for your website

export const Screenshot = ({lightSrc, darkSrc, alt, caption, maxWidth = "880px"}) => {
  return <div style={{
    margin: "1rem auto",
    maxWidth,
    width: "100%"
  }}>
      <Frame>
        <img className="block dark:hidden" src={lightSrc} alt={alt} />
        <img className="hidden dark:block" src={darkSrc} alt={alt} />
      </Frame>
      {caption ? <p style={{
    marginTop: "0.5rem",
    fontSize: "0.875rem",
    color: "inherit",
    opacity: 0.8
  }}>
          {caption}
        </p> : null}
    </div>;
};

Web Widgets let you deploy your agent on web pages through an embeddable widget.

**Access:** Open **Web Widgets** in the main menu.

<Screenshot lightSrc="/images/manage__widgets-list-light.png" darkSrc="/images/manage__widgets-list-dark.png" alt="Web Widgets list showing widget name, agent, features, and last updated" />

## Use Web Widgets When You Need To

* add voice or chat to your website
* create different widgets for different pages or audiences
* preview how the experience will look before you publish it
* manage share links and embed code without changing your agent itself

Each widget is a customer-facing experience layer on top of an agent. One agent can power multiple widgets with different configurations.

## Widget List

The list shows:

* **Name**
* **Agent**
* **Features** (voice/text)
* **Updated** timestamp
* **Actions** menu

Row click opens the widget editor. Cmd/Ctrl+click opens in a new tab.

## Create Widget Flow

Use **Create Widget** to open the creation form.

Required fields:

* widget name
* agent

After creation, the platform redirects you to the full widget configuration editor with the current tabs: **Setup**, **Appearance**, **Content**, **Features**, **Actions**, **Privacy**, **Export**, and **Share**.

## Working with Multiple Widgets

You can maintain separate widgets for:

* different website pages
* different audiences/use cases
* different agent personas

Each widget has independent configuration, share links, and embed code.

## Next Steps

<CardGroup cols={2}>
  <Card title="Widget Configuration" icon="sliders" href="/manage/web-widgets/configuration">
    Configure all eight widget editor tabs, from setup through share and export
  </Card>

  <Card title="Widget Share Links" icon="link" href="/manage/web-widgets/share-links">
    Create hosted preview links for reviewers and stakeholders
  </Card>

  <Card title="Agent Editor" icon="robot" href="/build/getting-started/agent-editor">
    Tune agent behavior used by your widgets
  </Card>
</CardGroup>