Skip to content

Chat Widget: Style Settings ​

Want to make your chat widget perfectly match your website's brand? The Style tab gives you full control over the colors, helping you create a seamless and professional look for your visitors.

Customizing the appearance is simple. From your chat widget editor, just click the Style tab (located next to "General" and "Channels") to access all the color settings. You can also configure chat settings from the General tab.

Customizing Your Widget's Colors ​

This section allows you to change the color of every part of your chat widget, from the header to the floating bubble button.

To change a color, simply click the color swatch next to any setting. A color picker will pop up, allowing you to select your exact brand color or choose from the palette.

The Style tab in the Chat Widget settings

  • Header Background Color: This changes the background color for the entire header section (the very top bar) of your chat window.
  • Header Title Color: This sets the text color for the main title (your Profile/Page Name) in the header.
  • Header Caption Color: This sets the text color for the smaller caption text (like "Typically replies in an hour") right below the title.
  • Channel Icon Background Color: This controls the background color of the buttons for your individual chat channels (like WhatsApp, Messenger, etc.).
  • Bubble Button Background Color: This changes the background color of the floating bubble button that appears on your website.
  • Close Button Color: This sets the color of the 'X' (close) icon within the chat window header.

By adjusting these settings, you can ensure your chat widget doesn't just feel like a third-party tool, but a fully integrated part of your site.