Modo escuro
Conforto visual em qualquer ambiente.
O novo frontend tem suporte nativo a modo escuro, disponível em todas as telas e totalmente integrado com o sistema de temas das administradoras (whitelabel).
Como ativar
- Botão de alternância no canto superior direito do cabeçalho, ao lado das notificações e do menu do usuário.
- Alterna entre:
- Claro (padrão): interface sempre em fundo branco, independente da preferência do sistema.
- Escuro: interface sempre em fundo escuro.
- Automático: segue a preferência configurada no sistema operacional.
- Preferência salva no navegador e persiste entre sessões.
Novos usuários abrem o app no modo claro por padrão. Quem já tinha escolhido um tema antes continua exatamente como estava — a mudança só afeta quem nunca escolheu.
Integração com o sistema operacional
- No modo automático, usa a API
prefers-color-schemedo navegador. - Se o Windows ou macOS estiver configurado para tema escuro (Configurações → Personalização → Cores), o sistema já carrega no modo escuro sem configuração adicional.
- Útil para uso noturno ou em ambientes com pouca luz, evitando impacto visual de tela branca intensa.
Whitelabel e modo escuro
- Sistema de cores das administradoras funciona em ambos os modos.
- Cores primárias e secundárias da marca são ajustadas automaticamente para variantes escuras.
- Garante legibilidade e contraste adequados.
Gráficos e componentes visuais
- Gráficos, tabelas, modais, drawers e demais componentes têm variantes escuras.
- Nenhuma tela ou seção fica “quebrada” no modo escuro — requisito de design desde o início da reescrita.
Dica
- Se você usa múltiplas abas do sistema, o modo aplica ao navegador inteiro (não é por aba).
- Para testar os dois modos lado a lado, use uma janela anônima.