How to Change Color of AI Chatbot Online Indicator

Ask the Community Customization
1

The CSS rule provided below will allow you to change the color of your AI Chatbot’s online indicator. Any questions? Please let me know. Enjoy!

/* Change Color of Online Indicator */

[class*="window-header__OnlineStatus-sc"] {
  background: #10ac84 !important; // change this value to your favorite color.
}
3

Hi there, @Petar_Dietrich :waving_hand:

I’ve just checked this code and it didn’t work on my end. However, the good news is that you don’t have to use a CSS code to change the color of the Online Status indicator, since the widget offers a special setting for this :slightly_smiling_face:

image
image329×412 18.8 KB
image
image321×443 7.02 KB

image
image330×276 6.9 KB

4

Perfect! Thank you. I was unaware of that. Feel free to edit/delete my related post.

Also, to ensure consistency, can you guys kindly add Theme Customization color options for the Chatbot’s “Copy”, “Like”, and “Dislike” icons? See below.

Reference: Useful Tip: How to Change Color of AI Chatbot "Copy", "Like", and "Dislike" Icons

Thank you!

ai-chatbot-add-color-customization-copy-like-dislike-icons
ai-chatbot-add-color-customization-copy-like-dislike-icons1301×860 31.5 KB

5

Sure, I’ve added this idea to the Wishlist. Feel free to upvote it - Add option to change color of Copy, Like and Dislike buttons individually