Gerador de Paleta de Cores

Paleta para identidade digital brasileira e dark mode crescente

Equipes de design no Brasil partem de uma cor de marca para construir todo o sistema cromatico de um produto digital. Este gerador produz matizes, sombras e esquemas harmonicos a partir de um unico HEX , entrada direta para configuracao do Tailwind CSS (tailwind.config.js) ou arquivos de tokens de design. O dark mode esta em crescimento acelerado no Brasil, especialmente em aplicativos moveis; o gerador permite testar a paleta tanto em fundo claro quanto escuro antes de qualquer commit.

O e-MAG (Modelo de Acessibilidade em Governo Eletronico) e o Decreto-Lei 83/2018 (Portugal) exigem contraste minimo de 4,5:1 para texto normal. Cada cor gerada deve ser verificada com o Verificador de Contraste antes de ser aplicada a textos ou elementos interativos. Tons proximos de 50% de luminosidade costumam falhar tanto o teste texto-branco quanto o teste texto-preto.

Requisitos de contraste WCAG / e-MAG

Limites da teoria da harmonia de cores

Esquemas de harmonia (complementar, triadico, etc.) descrevem relacoes matematicas na roda HSL , nao garantem um resultado estetico adequado em todos os contextos. Um par complementar laranja-azul e tecnicamente valido, mas pode ser inadequado para uma marca de servicos financeiros ou saude. Use a paleta gerada como ponto de partida e adapte conforme o tom de marca, setor e publico-alvo.

Da paleta aos tokens de design

Copie as propriedades CSS personalizadas para o bloco :root. Para fluxos com tokens, os valores HEX se importam diretamente no Style Dictionary ou Figma Tokens. O Extrator de Paleta e um ponto de partida util: extraia a paleta de uma imagem existente e refine aqui as matizes e sombras.