Widget Appearance
Make your chatbot look like it belongs on your website by customizing its colors, icon, logo, and more. All appearance settings are found in the Settings tab of your agent’s dashboard.Primary Color
The primary color sets the main accent color for your chat widget. This color is used for the chat bubble button, message highlights, and interactive elements.- Click the color picker to choose any color
- Enter a hex code directly (e.g.,
#0070f3) for exact brand matching - The default color is Chatref blue (
#0070f3)
Widget Icon
Choose from 8 icon styles for the chat bubble button that appears on your website:| Icon | Description |
|---|---|
| Default | The standard Chatref chat icon |
| MessageCircle | A circular message bubble |
| Bot | A robot face icon |
| HelpCircle | A question mark in a circle |
| Chat | A speech bubble icon |
| Support | A headset/support icon |
| Headphones | A headphones icon |
| MessageSquare | A square message bubble |
Dark Mode
Toggle Dark Mode on or off to switch between light and dark themes for the chat widget.- Dark mode on — The widget uses a dark background with light text
- Dark mode off — The widget uses a light background with dark text
Custom Logo
Upload your company or brand logo to replace the default Chatref branding in the chat widget header.Custom logo is available on Plus and Pro plans. Compare plans
- Upload a square image for best results
- PNG or JPG format recommended
- The logo appears in the chat widget header
Custom Footer
Add custom text to the bottom of your chat widget, such as “Powered by YourBrand” or a disclaimer.Custom footer is available on Plus and Pro plans. Compare plans
Button Label
Add a text label next to the chat bubble button. For example, you could add “Chat with us” or “Need help?” so visitors know exactly what the button does.Button label is available on Plus and Pro plans. Compare plans
Persistent Greeting
When enabled, the persistent greeting keeps your welcome message visible above the chat bubble even before visitors open the widget. This acts as a gentle invitation to start a conversation.- On — The greeting message stays visible as a small popup near the chat button
- Off — The greeting only appears after the visitor opens the chat widget