1001Ferramentas
🔄Geradores

Paleta Complementar

Gere a cor complementar (oposta na roda de cores) a partir de uma cor base em hex. Crie combinações de alto contraste para design, sites e identidade visual.

Complementar

Paletas complementares: opostos que prendem o olhar

Uma paleta complementar combina duas matizes que ficam a 180° uma da outra na roda de cores. Em HSL a fórmula cabe numa linha: H2 = (H1 + 180) mod 360. O resultado entrega o maior contraste possível para duas cores — e é exatamente por isso que o nosso córtex visual trava nele instantaneamente. O fisiologista Michel-Eugène Chevreul descreveu o efeito em 1839 como contraste simultâneo: ponha vermelho ao lado de verde e cada cor parece mais intensa do que pareceria sozinha.

Pares complementares clássicos

  • Vermelho & Verde — Natal, sinalização "pare / siga", estados de erro vs. sucesso.
  • Azul & Laranja — o famoso teal & orange da colorização hollywoodiana (pele caucasiana fica no campo laranja; fundo teal faz o rosto saltar). Visto em Avatar, Mad Max: Estrada da Fúria e quase todo pôster da Marvel.
  • Amarelo & Roxo — vibe real, teatral, Lakers, Cadbury.

Quando complementar vence

Use em CTAs (botão com cor oposta ao fundo da página), identidade de times esportivos (energia, rivalidade) e comunicação de estado em UI (vermelho para perigo / verde para sucesso). A variação split-complementary — a matiz base mais as duas vizinhas da oposta — mantém a energia com um pouco menos de tensão.

Acessibilidade e a armadilha do daltonismo

Pares complementares normalmente passam fácil na razão de contraste da WCAG 2.1, mas dois complementares muito saturados juntos podem vibrar de forma desagradável (evite #ff0000 sobre #00ff00). A solução: deixar um saturado e o outro dessaturado. Armadilha maior — a deuteranopia (vermelho/verde) afeta cerca de 5% dos homens; nunca dependa só de vermelho contra verde para comunicar estado. Adicione forma, ícone ou rótulo. Azul/laranja é o par complementar mais seguro para todos os tipos de daltonismo.

Regra de composição: 70/30, não 50/50

Dividir 50/50 entre dois complementares gera tensão visual — nenhuma cor vence. Designers usam proporção próxima de 70/30: uma cor domina a superfície, a outra aparece só como acento (CTA, link, alerta). Exemplos: McDonald's vermelho+amarelo, FedEx roxo+laranja, IKEA azul+amarelo — em todos os casos uma cor ocupa 70%+ da área.

FAQ

Funciona em camisa de time? Sim — times adoram complementar. Contraste máximo à distância é exatamente o que se quer em campo.

Imprime bem? Sim. Complementares bem saturados convertem limpo para CMYK e ficam vivos em couché.

É seguro para daltônicos? Pares vermelho/verde falham para ~5% dos homens. Use azul/laranja como complementar seguro, ou sempre adicione pista não-cromática (forma, ícone, rótulo).

Diferença entre complementar e split-complementary? Complementar são duas matizes a 180°. Split-complementary é uma matiz mais as duas vizinhas da sua oposta (150° e 210° à frente), suavizando a tensão sem perder o contraste.

Ferramentas Relacionadas