A versão curta
- A harmonia de cores é a qualidade de um conjunto de cores que parecem pertencer umas às outras.
- As seis harmonias clássicas são monocromática, análoga, complementar, complementar dividida, triádica e tetrádica, cada uma definida por posições no círculo cromático.
- As relações de tom, só por si, não garantem harmonia: as cores precisam também de uma distribuição sensata de luminosidade e de saturação controlada.
- Uma cor dominante com quantidades menores das outras quase sempre parece mais harmoniosa do que quantidades iguais de todas as cores.
- Cores que partilham um subtom, como um toque de calor ou do mesmo tom, tendem a parecer ligadas mesmo quando estão longe no círculo cromático.
Nesta página
A harmonia de cores é a sensação de que um grupo de cores pertence junto. Os designers costumam construí-la de duas maneiras: escolhendo tons que ficam numa relação conhecida no círculo cromático, como vizinhos ou opostos, e equilibrando tudo o resto, ou seja, a luminosidade, a saturação e a quantidade de cada cor. Se acertares na primeira e falhares na segunda, o resultado continua a destoar. Se acertares em ambas, até combinações invulgares parecem calmas e intencionais.
O círculo cromático e porque ajuda
O círculo organiza os tons numa circunferência para que as relações se tornem geometria. Os vizinhos partilham muita da mesma luz e misturam-se com suavidade; os opostos não partilham nada e fazem-se parecer mais intensos um ao outro. Cada harmonia clássica é uma forma desenhada sobre o círculo. Se o círculo em si é novidade para ti, começa por o círculo cromático.
conic-gradient(from 0deg, #e64545, #e6a645, #c8e645, #45e66a, #45e6d4, #4596e6, #6a45e6, #d445e6, #e64545)As seis harmonias de cores clássicas
Eis cada esquema construído a partir da mesma base verde-azulada, #30a69c, para veres como a relação muda o ambiente enquanto a cor de partida fica quieta.
Tons no círculo
Sensação
Parte mais difícil
Tons no círculo
Sensação
Parte mais difícil
Tons no círculo
Sensação
Parte mais difícil
Tons no círculo
Sensação
Parte mais difícil
Tons no círculo
Sensação
Parte mais difícil
Tons no círculo
Sensação
Parte mais difícil
Um guia grosseiro para escolher: quanto menos e mais próximos os tons, mais fácil é alcançar a harmonia. Os esquemas monocromáticos e análogos quase se resolvem sozinhos. Os complementares, triádicos e tetrádicos dão mais energia, mas pedem mais disciplina nas três áreas seguintes.
A harmonia é também luminosidade e saturação
Olha para a faixa triádica acima. Os tons são de manual, mas, com a mesma intensidade, parecem uma caixa de brinquedos. É porque o círculo só descreve o tom. Duas outras propriedades decidem se as cores assentam mesmo bem juntas.
- Luminosidade: um conjunto harmonioso costuma abranger valores claros, médios e escuros. Cinco cores com a mesma luminosidade esbatem-se umas nas outras; uma gama dá ao olhar onde descansar e algo para ler.
- Saturação: mantém a maioria das cores calmas e deixa uma só vibrante. Quando todas estão na intensidade máxima, competem, e o esquema lê-se como ruído.
- Subtom partilhado: cores que tendem todas ligeiramente para o quente, ou que levam todas um vestígio do mesmo tom, parecem ligadas mesmo quando estão longe no círculo. Juntar um pouco da cor principal aos neutros é a forma mais rápida de o conseguir.
Para fazer estes ajustes por números, usa um formato que separe a luminosidade do tom. O HSL é a escolha familiar; o OKLCH é melhor a manter a luminosidade uniforme quando mudas o tom, o que torna muito mais fácil construir esquemas equilibrados.
Proporção: deixa uma cor liderar
A maior diferença entre um design harmonioso e um caótico costuma ser a proporção, não o tom. Quantidades iguais de duas ou três cores fazem o olhar saltar entre elas. Uma cor dominante, uma de apoio e um pequeno destaque dão-lhe uma hierarquia a seguir. A regra 60 30 10 é uma divisão útil para começar.
Destoa
- Áreas iguais de cada cor
- Todas as cores com saturação total
- Todas as cores com a mesma luminosidade
- Neutros cinzentos puros ao lado de cores quentes
- Opostos em contacto ao longo de bordas compridas
Harmoniza
- Uma cor claramente dominante
- Um destaque vibrante, o resto mais calmo
- Uma gama do claro ao escuro
- Neutros com um toque do tom principal
- Opostos separados por espaço ou por um neutro
Um Mark: repara que cor lidera, quanto do enquadramento cobre e onde descansam as palavras.
Um segundo Mark com as mesmas palavras. A relação de cores muda o ambiente; a mensagem fica igual.
Como construir na prática uma paleta harmoniosa
- 1
Parte de uma cor que signifique algo
Uma cor de marca, um produto, um lugar. A harmonia é mais fácil à volta de um ponto fixo do que a partir do nada.
- 2
Escolhe uma relação para o ambiente
Análoga para calma, complementar ou complementar dividida para energia, monocromática para contenção.
- 3
Distribui a luminosidade e acalma a saturação
Faz uma versão clara, uma média e uma escura e depois baixa a saturação de tudo menos do destaque.
- 4
Decide as proporções
Diz que cor cobre a maior parte do espaço, qual apoia e qual aparece só em pequenos toques.
- 5
Testa com palavras reais
Põe a paleta num layout real e verifica o contraste do texto. Uma harmonia que não aguenta um título não está terminada.
Se preferires partir de uma paleta já equilibrada, cada Mark do Gradiently é um fundo vivo acabado cujas cores, materiais e luz foram compostos juntos, e o Studio assenta as tuas palavras nele com a Tinta automática a escolher letra clara ou escura por linha. Para gerar a tua do zero, vê geradores de paletas de cores.
Perguntas frequentes
O que é a harmonia de cores?
É a qualidade de cores que parecem pertencer umas às outras, normalmente conseguida com relações de tom no círculo cromático combinadas com luminosidade, saturação e proporção equilibradas.
Quais são os tipos de harmonia de cores?
As seis clássicas são monocromática, análoga, complementar, complementar dividida, triádica e tetrádica.
Que harmonia de cores é mais fácil de usar?
Os esquemas monocromáticos e análogos, porque os tons estão próximos e raramente destoam. Precisam de boa distribuição de luminosidade para não parecerem planos.
Porque é que as minhas cores complementares destoam?
Normalmente porque ambas estão com saturação total e em quantidades iguais. Deixa uma dominar, acalma a outra num destaque e separa-as com um neutro.
Escrito pela Gradiently
A equipa por trás da Gradiently, uma ferramenta de design construída em torno dos Marks: gradientes vivos que fazem tudo o que crias parecer teu.
Ver o nosso perfil