Principal Chat ao Vivo no Site Como ativar modo escuro no widget de chat

Como ativar modo escuro no widget de chat

Última atualização em May 21, 2026

O widget suporta modo escuro automático, acompanhando o tema do sistema operacional ou navegador do usuário.

Isso permite que o chat combine visualmente com sites que possuem tema claro e escuro.

Como ativar

Adicione a opção darkMode dentro do objeto chatwootSettings.

window.chatwootSettings = {
  // outras configurações
  darkMode: "auto",
};

Valores disponíveis

Valor Função
"light" Mantém sempre o widget no tema claro
"auto" Alterna automaticamente entre claro e escuro baseado no sistema do usuário

Exemplo completo 

window.chatwootSettings = {
  hideMessageBubble: false,
  position: "right",
  locale: "pt_BR",
  darkMode: "auto",
  type: "expanded_bubble",
  launcherTitle: "Fale conosco"
};

Observações importantes

  • O modo "dark" forçado ainda não é suportado

  • O valor padrão é "light"

  • O modo "auto" detecta automaticamente a preferência do usuário

  • Funciona melhor em sites que também possuem suporte a dark mode

Resultado

Quando o usuário estiver usando modo escuro no sistema operacional ou navegador, o widget acompanhará automaticamente o tema, mantendo uma aparência consistente com o restante do site.