> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.crisp.chat/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to change the chatbox color

*This article explains how to change the main color theme of the Crisp chatbox.*

You can quickly choose a predefined color from the chatbox appearance settings. If you need custom brand colors, use **Advanced Chatbox Customization** from the chatbox theme settings.

---

# ${color}[#0080dd](Watch the chatbox customization walkthrough)

If you prefer a quick visual walkthrough, this video shows how to customize your Crisp chatbox, from basic appearance settings to texts, position offsets, and custom colors.

${youtube}[How to Customize Your Crisp Live Chat Widget](qvJ-kKTse28)

---

# ${color}[#0080dd](Choose a predefined color theme)

The fastest way to adjust the chatbox color is to select one of the predefined color themes.

__To change the chatbox color theme:__
1. Go to [**Crisp**](https://app.crisp.chat)
2. Open **Settings → Chatbox Settings → Chatbox Appearance**
3. Find **Color theme**
4. Select the color you want to use
5. Let Crisp auto-save the change

![Choose a chatbox color theme](https://storage.crisp.chat/users/helpdesk/website/-/8/7/a/e/87ae2703583ac800/cleanshot-2026-01-29-at-131841_1v5mfz3.png =1000xauto)

---

# ${color}[#0080dd](Use custom colors)

Custom colors are now managed from **Settings → Chatbox Settings → Chatbox Appearance → Chatbox Theme → Advanced Chatbox Customization**.

In the advanced customization UI, you pick the main baseline colors and Crisp automatically generates the lighter and darker variants used by the chatbox. This keeps the design coherent while giving you control over your brand colors.

| When a custom color is configured, the predefined color selector will direct you back to **Advanced Chatbox Customization** instead of overwriting your custom theme.

---

# ${color}[#0080dd](Need deeper branding?)

Color is only one part of the chatbox theme. You can also customize texts, localized wording, background patterns, and other appearance settings from [Advanced Chatbox Customization](/en/article/how-to-customize-my-chatbox-1hj537j/).
