Dark Mode by Traslatability

O Dark Mode by Traslatability (Dark Mode Plugin / Addon for WordPress & Elementor) é uma extensão complementar de acessibilidade e experiência do usuário (UX) para WordPress e Elementor, desenvolvida sob medida para blogs de tecnologia, portais de notícias, plataformas de documentação, lojas virtuais (WooCommerce), sites corporativos e portfólios que buscam oferecer uma transição suave entre temas claros e escuros (Light / Dark Mode), reduzindo a fadiga visual dos visitantes em ambientes com pouca luz e modernizando a identidade do site sem exigir reescritas manuais de código CSS.

Destaques:

• Detecção Automática de Preferência do Sistema Operacional (OS Color Scheme Detection): Lê nativamente a regra de mídia CSS @media (prefers-color-scheme: dark) do navegador ou dispositivo do visitante (macOS, iOS, Windows, Android), aplicando automaticamente o modo escuro no primeiro acesso sem exigir que o usuário clique manualmente no botão de troca.
• Persistência de Preferência via Armazenamento Local (Local Storage / Cookies): Lembra a escolha manual do usuário para visitas futuras e navegação entre diferentes abas e páginas do site, garantindo consistência na navegação sem o incômodo efeito de clarão branco (flash of unstyled content – FOUC) durante o carregamento de novas URLs.
• Botão Alternador Flutuante e Integrado (Dark Mode Switcher):
  • Posicionamento Flutuante Flexível: Permite fixar o botão de alternância (floating switch) nos cantos da tela (inferior/superior direito ou esquerdo), com múltiplos estilos de design (ícones clássicos de sol e lua, botões de alternância estilo iOS/toggle pills ou botões minimalistas);
  • Widget Dedicado para Elementor: Insere um componente arrastar-e-soltar para posicionar o botão de troca de tema diretamente dentro de cabeçalhos (headers), menus de navegação fixos ou rodapés desenhados no Elementor Theme Builder;
  • Suporte a Shortcodes: Possibilidade de embutir o gatilho de alternância em qualquer área do site, menus nativos do WordPress ou barras laterais via código curto.
• Mecanismo Inteligente de Inversão de Cores e Paletas Customizadas:
  • Algoritmo de Inversão Inteligente: Transforma automaticamente fundos claros em tons de cinza profundos/pretos e fontes escuras em tons legíveis de alto contraste, preservando a hierarquia visual do site;
  • Substituição Manual de Cores: Painel de ajustes finos para customizar a cor de fundo exata do modo escuro (evitando pretos puros rgb(0,0,0) para utilizar tons confortáveis como carvão #121212 ou azul escuro), cor do texto principal, links e elementos com foco;
  • Ajuste de Imagens e Mídias: Reduz automaticamente o brilho e contraste excessivo de fotografias em modo escuro para evitar ofuscamento da visão, com suporte a substituição de imagens de logotipos (alternando automaticamente entre versão preta e versão branca da marca).