Skip to main content
All CollectionsChatThe Chat widget
Customise your chat widget
Customise your chat widget

Customise your Chat widget using our customisation settings, ensuring it fits your site's design and provides a great user experience.

Gareth Burroughes avatar
Written by Gareth Burroughes
Updated over 3 months ago

Customise the chat widget

  1. Expand the User menu, then go to Settings > Chat > Settings > Widget.

  2. Under Color picker, you can choose the colours of your chat widget. Get creative or use your brand's colour scheme. It's up to you.

  3. The colour picker uses hex colour codes. Enter your hex colour code or select the box to open the visual colour selector.

  4. You can edit the following colours:

    • Main colour

      The colour of the top bar, visitor speech bubbles, and send button. Enter a hex code or use the visual selector.

    • Text colour

      Use White text if you have a dark main colour and Dark text with a light main colour.

    • Support colour

      The colour of the agent speech bubbles and the reply text box. Enter a hex code or select to use the visual selector.

    • Text colour

      Use White text if you have a dark support colour and Dark text with a light support colour.

  5. Under Animation, choose a theme. Themes are little animations to make your widget stand out. You can select a different theme for both new visitors and returning visitors.

  6. There are three theme variations:

    1. Basic

      No animation

    2. Bounce

      A bouncing animation

    3. Sonar

      A pulsating, colour changing animation

    Select BASIC, BOUNCE, or SONAR to select your theme.

  7. Select SAVE AND GENERATE CODE to finish customising.


Next steps

Did this answer your question?