Skip to main content
The widget customizer lets you control how your Chat Agent appears on your website. Adjust colors, text, icons, and layout to create a seamless brand experience for your visitors.

​
Accessing the Customizer

  1. Go to Engagement > Chat Agent.
  2. Click on the bot you want to customize.
  3. Navigate to the Widget or Customize tab.

​
Design Options

​
Colors

Customize the color scheme of your chat widget to match your brand:
SettingDescription
Primary ColorThe main accent color used for buttons and highlights
Header ColorBackground color of the widget header
Body ColorBackground color of the chat conversation area
User Bubble ColorBackground color of messages sent by the visitor
Bot Bubble ColorBackground color of messages from the bot
Input ColorBackground color of the message input field
Send Button ColorColor of the send message button

​
Theme

Choose between Light and Dark theme modes. The theme controls the default color palette and contrast settings for the widget.
  • Light — White/light backgrounds with dark text. Best for light-colored websites.
  • Dark — Dark backgrounds with light text. Best for dark-themed websites.
Custom colors override theme defaults. If you set specific colors, they take priority regardless of the selected theme.

​
Widget Icon

Upload a custom icon or avatar that appears on the chat bubble and in the widget header. This is typically your logo or a brand mascot.
  • Recommended size: 64×64 pixels or larger
  • Supported formats: PNG, JPG, SVG

​
Text Content

Customize the text displayed in the widget:
  • Welcome Message — The first message visitors see when they open the chat. Set during bot creation and editable here.
  • Placeholder Text — The hint text inside the message input field (e.g., “Type your message…”).
  • Header Title — The name displayed at the top of the widget.

​
Live Preview

As you make changes, a live preview of the widget updates in real time on the right side of the customizer. This lets you see exactly how your widget will appear to visitors before deploying it.

​
Saving Changes

Click Save to apply your customizations. Changes take effect immediately on your website if the widget is already deployed.
If you haven’t deployed the widget yet, your customizations are saved and will be applied when you add the embed code to your site.

​
Next Steps

Deploy Your Bot

Add the chat widget to your website.

Create a Bot

Set up a new chat agent.