Cores complementares e paletas

Como funcionam esses esquemas de cores

Cada esquema é construído girando o matiz ao redor do círculo cromático. A cor complementar fica exatamente do lado oposto (180°): contraste máximo, perfeito para destacar um botão ou um detalhe. Um esquema triádico usa três cores separadas por 120°, e um esquema tetrádico usa quatro cores a 90°: paletas vivas, mas equilibradas. As cores análogas (±30°) ficam lado a lado e transmitem harmonia e calma, enquanto as cores complementares divididas (150° e 210°) trazem a força da complementar em uma versão mais suave e fácil de usar.

Dicas práticas para usar uma paleta

A regra mais simples é a 60-30-10: uma cor dominante para cerca de 60% da composição (normalmente a mais neutra, ou a sua cor base), uma cor secundária para 30% e a mais marcante só para 10%: destaques e chamadas para ação. Se você usar essas cores no texto, confira sempre se o par texto/fundo continua legível: você pode testar com o nosso verificador de contraste WCAG.

O círculo dos pintores e o da tela

As cores complementares que se aprendem na escola vêm do círculo RYB dos pintores, em que o oposto do vermelho é o verde; na tela se trabalha em RGB, em que o oposto do vermelho é o ciano. São dois modelos diferentes e dão respostas diferentes para a mesma pergunta.

As ferramentas digitais quase sempre usam o espaço HSL, que é um RGB reorganizado: a complementar é o matiz a 180 graus. O resultado é coerente com o que se vê em um monitor, mas não com a mistura de pigmentos: quem imprime precisa refazer as contas no círculo certo.

Por que duas complementares puras cansam a vista

Duas cores opostas em saturação máxima, lado a lado, produzem um tremor nas bordas: o olho não consegue focar nas duas ao mesmo tempo e o limite parece vibrar. É o efeito que torna ilegível o texto vermelho sobre fundo verde.

O par funciona quando uma das duas é dessaturada ou clareada: um azul profundo com um laranja suave é a mesma relação, só que tranquila. Por isso os cartazes de cinema usam há vinte anos laranja e azul-petróleo, e não laranja vivo e azul vivo.

O esquema depende de quantas cores você precisa

Uma cor complementar serve para destacar uma coisa só: um botão, um preço, uma chamada para ação. Com mais de um elemento na cor oposta, o destaque se anula, porque duas coisas gritando já não gritam.

Quando você precisa de mais cores, passa para outro esquema: análogo (matizes vizinhos) para um efeito calmo e coerente, triádico para três cores vivas, mas equilibradas, complementar dividido para o contraste de uma complementar sem a dureza dela. Acima de quatro cores, uma paleta deixa de parecer uma decisão.

Veja também

Antes de adotar um par, o Verificador de contraste de cores diz se o texto será legível e o Simulador de daltonismo mostra se funciona para todos. Para deixar uma cor mais clara ou mais escura, há Tons e sombras de uma cor.