Cores quentes e frias: usar a temperatura com intenção

As cores quentes e frias são as duas metades do círculo cromático. Os vermelhos, laranjas e amarelos parecem quentes, como o fogo e a luz do sol; os verdes, azuis e violetas parecem frios, como a água, a sombra e o fim do dia. A temperatura muda a sensação de um design antes de alguém o ler: as cores quentes avançam e dão energia, as frias recuam e acalmam. Usá-la com intenção é uma das formas mais rápidas de fazer uma paleta parecer pensada.

A temperatura é relativa

A fronteira entre quente e frio não é fixa. Os verdes amarelados e os vermelhos violeta ficam no limite, e qualquer cor parece mais quente ao lado de uma mais fria. Um magenta ao lado de um azul céu lê-se como quente; o mesmo magenta ao lado do laranja lê-se como frio. É por isso que deves avaliar a temperatura na paleta e não amostra a amostra.

As cores também têm temperatura dentro de um tom. Um vermelho que tende para o laranja é mais quente do que um vermelho que tende para o azul, e um azul com um toque de verde é mais quente do que um que tende para o violeta. Os designers chamam subtom a esta tendência, e é ela que faz dois “vermelhos” chocarem.

Como as cores quentes e frias criam profundidade

As cores quentes tendem a parecer avançar e as frias a recuar. Os pintores de paisagens usam isto há séculos: o ar dispersa a luz, por isso as colinas distantes parecem mesmo mais azuis e mais pálidas, e os nossos olhos leem o frio e o pálido como longe. Podes usar o mesmo efeito no design plano.

A regra prática: põe as cores frias nas grandes áreas de fundo e guarda as quentes para o que deve chegar primeiro a quem vê. Um apelo à ação quente numa página fria destaca-se sem precisar de ser grande, o que encaixa bem na regra 60-30-10.

Neutros quentes e frios

Os cinzentos, brancos e pretos também têm temperatura, e isso importa mais do que as pessoas pensam. Um branco-sujo quente parece papel; um branco frio parece um ecrã ou uma clínica. Um design que mistura um fundo cinzento quente com texto cinzento frio parece muitas vezes ligeiramente errado sem que ninguém saiba dizer porquê.

:root {
  /* Warm neutrals: pair with reds, oranges, golds */
  --paper: #f5efe6;
  --stone: #b8ada0;
  --charcoal-warm: #3d3530;

  /* Cool neutrals: pair with blues, greens, violets */
  --mist: #eef2f6;
  --slate: #a3adb8;
  --charcoal-cool: #2b3240;
}

Juntar quente e frio num só gradiente

Os gradientes do quente para o frio estão entre os mais impressionantes que há, e os pores do sol provam-no. São também os que mais facilmente correm mal, porque as cores quentes e frias ficam muitas vezes opostas no círculo e uma mistura direta entre elas passa pelo cinzento. A solução é encaminhar a mistura por uma cor que pertença aos dois lados, normalmente rosa, magenta ou violeta.

A proporção também conta aqui. Deixa uma temperatura liderar e a outra aparecer como contraste. Um gradiente sobretudo frio com um brilho quente numa das margens parece luz de fim de tarde; uma divisão igual entre quente e frio parece indecisa. Gradientes de pôr do sol tem muitos mais exemplos de quente e frio a partilhar o mesmo campo.

Cores quentes e frias no design do dia a dia

• O quadro do menu de um café: fundo creme quente, texto cor de café expresso e um só acento terracota, para parecer a sala onde está pendurado
• Uma aplicação bancária: superfícies em ardósia fria e azul, com um só âmbar quente para alertas que pedem atenção
• Um cartaz de evento noturno: campo violeta frio e profundo com um título laranja quente que salta para a frente
• Um lançamento de cuidados de pele: névoa fria e salva, animadas por um único pêssego quente no nome do produto
• Uma promoção desportiva: vermelho e laranja quentes a liderar, um azul marinho frio só para a letra pequena

Em cada caso, uma temperatura define o clima e a outra dirige a atenção. Essa combinação é também uma forma suave de contraste de cores complementares, sem o choque total dos opostos verdadeiros.

Escolher uma temperatura para a tua marca

1. 1

   Parte da sensação

   As marcas acolhedoras, animadas e práticas costumam tender para o quente. As marcas precisas, calmas e de confiança costumam tender para o frio. Nenhuma é melhor; escolhe a que corresponde ao que fazes.

2. 2

   Escolhe uma temperatura principal

   Constrói a maior parte da paleta, incluindo os neutros, de um só lado. Isso dá à marca um clima coerente.

3. 3

   Junta um acento do outro lado

   Um único acento quente numa marca fria, ou um frio numa marca quente, dá contraste e um sítio claro onde o olhar pousa.

4. 4

   Testa no contexto

   Verifica a paleta nos ecrãs e materiais reais onde vai viver. As cores mudam entre ecrãs e outra vez na impressão; vê como escolher as cores da marca.