# Chatbot
Source: https://docs.dappier.com/embed-widgets



After configuring your AI Agent, you now have the option to enable it as a web chatbot or a dockable widget on any website.

<img className="block" src="https://mintcdn.com/dappier-20/GPubPuGcoHagv5PD/images/Embed_Widget.png?fit=max&auto=format&n=GPubPuGcoHagv5PD&q=85&s=dfe81c30b53b1058342a678095f6bfbb" alt="Embed Widget" data-og-width="2314" width="2314" data-og-height="1676" height="1676" data-path="images/Embed_Widget.png" data-optimize="true" data-opv="3" srcset="https://mintcdn.com/dappier-20/GPubPuGcoHagv5PD/images/Embed_Widget.png?w=280&fit=max&auto=format&n=GPubPuGcoHagv5PD&q=85&s=d9bd123749d80e1751294ed8ed2c9a3d 280w, https://mintcdn.com/dappier-20/GPubPuGcoHagv5PD/images/Embed_Widget.png?w=560&fit=max&auto=format&n=GPubPuGcoHagv5PD&q=85&s=407bac300ff62024b3257668c8bf2e95 560w, https://mintcdn.com/dappier-20/GPubPuGcoHagv5PD/images/Embed_Widget.png?w=840&fit=max&auto=format&n=GPubPuGcoHagv5PD&q=85&s=548a0bcdf0aa5e954d13894db855dc78 840w, https://mintcdn.com/dappier-20/GPubPuGcoHagv5PD/images/Embed_Widget.png?w=1100&fit=max&auto=format&n=GPubPuGcoHagv5PD&q=85&s=56b5f09b068ed8eebd063bc411cd2023 1100w, https://mintcdn.com/dappier-20/GPubPuGcoHagv5PD/images/Embed_Widget.png?w=1650&fit=max&auto=format&n=GPubPuGcoHagv5PD&q=85&s=175f5fed99a2c19fd0a2d9408ef3ea14 1650w, https://mintcdn.com/dappier-20/GPubPuGcoHagv5PD/images/Embed_Widget.png?w=2500&fit=max&auto=format&n=GPubPuGcoHagv5PD&q=85&s=4738afe328f5924b1c810db35435d971 2500w" />

In the Embed tab of your AI Agent, customize its look and feel by adding the necessary elements:

1. **Upload a Logo**:
   * Select and upload an image file (PNG or JPG) to represent your chatbot. This logo will help brand your chatbot and make it recognizable to users.

2. **Upload a Chat Icon**:
   * Choose an image (PNG or JPG) with a minimum size of 128px to serve as the chat icon. This icon will appear when your chatbot responds to users, adding a visual cue to the interaction.

3. **Choose Button Background and Text Colors**:
   * Customize the appearance of your chatbot’s buttons by selecting background and text colors. This allows you to match the chatbot’s design with your brand’s color scheme for a cohesive look.

4. **Disable the Dappier Logo**\*:
   * If you prefer a completely white-labeled chatbot, you have the option to disable the Dappier logo.

5. **Preview Your Chatbot**:
   * After making your customizations, visit the Hosted URL provided in your AI Agent’s settings to preview your chatbot. This allows you to see how the chatbot will appear and function on your website before finalizing the changes.

By following these steps, you can ensure that your chatbot is well-branded, visually appealing, and seamlessly integrated into your website.

\**Note: Disabling the Dappier logo requires a Dappier Professional Plan or higher.*