O que é o Gerador de Paleta de Cores
O Gerador de Paleta de Cores cria combinações harmônicas de cores a partir de uma cor-base, usando teorias de harmonia consagradas do design — complementar, análoga, tríade, tetrade e monocromática. Gere paletas para sites, apps, identidades visuais e apresentações, com códigos HEX, RGB e HSL prontos para copiar, além de visualização de contraste para acessibilidade.
Como usar o Gerador de Paleta de Cores
Selecione sua cor principal (o seletor de cor ou digite o código HEX) e escolha o tipo de harmonia. A ferramenta gera automaticamente as cores complementares da paleta. Copie os códigos individuais ou a paleta inteira; verifique o contraste das combinações cor de fundo x cor de texto para garantir legibilidade.
Quando usar o Gerador de Paleta de Cores
- Identidade visual: derive a paleta completa da marca a partir do logo (cor principal + secundárias + destaques).
- Design de interfaces: defina cores de botões, links, alertas e estados com harmonia garantida.
- Apresentações e materiais: paletas coerentes para slides, posts e infográficos sem treinar "olho de designer".
- Acessibilidade: confira se o texto sobre o fundo escolhido atende ao contraste mínimo WCAG.
Como funciona: explicação técnica
Harmonias implementadas no círculo cromático (HSL): complementar (+180° — contraste máximo), análoga (±30° — sensação de unidade), tríade (120° — equilíbrio vibrante), tetrade (dois pares complementares) e monocromática (variações de saturação e luminosidade). Para acessibilidade, o contraste é calculado pela razão WCAG 2.1: textos normais exigem razão ≥ 4,5:1 (nível AA); textos grandes, ≥ 3:1. A cor no formato HSL facilita ajustes: mudar a luminosidade (L) mantém o matiz, criando variações coerentes da mesma cor.
Tipos de harmonia e quando usar
| Harmonia | Efeito | Uso típico |
|---|---|---|
| Complementar | Contraste forte | CTAs e destaques |
| Análoga | Sensação calma e coesa | Fundos e temas inteiros |
| Tríade | Colorido e equilibrado | Marcas e ilustrações |
| Monocromática | Elegante e sofisticado | Interfaces minimalistas |
Exemplos práticos de uso
- Marca de tecnologia: azul #2563EB como principal, análoga azul-esverdeada para seções, complementar âmbar para botões de ação.
- Dashboard financeiro: monocromática em verde para valores positivos e vermelho monocromático para negativos.