Skip to main content

Enable dark mode on live-chat widget

Modern websites support the dark mode theme along with the light mode theme. Therefore, it is essential to have a live chat that works with both themes. This guide helps you to set up dark mode for the Chatwoot live-chat widget on your website.

Here is a quick glimpse of how dark mode functions on the live chat widget.


To enable dark mode on Chatwoot widget, use the darkMode parameter along with the chatwootSettings.

darkMode parameter supports two values.

  1. light - Enable only light mode. This is the default value.
  2. auto - Enable dark mode based on the operating system preference.
window.chatwootSettings = {
//... other Settings
darkMode: "auto",

Note: dark only is not supported now. We will add the support in future releases.