DEV Community

Cover image for Teoria das Cores para Frontend
Lissa Ferreira for Feministech

Posted on • Edited on

Teoria das Cores para Frontend

O que é Teoria das Cores?

A teoria das cores é o estudo dos sentimentos, como perigo, amor, afeto, esperança, calma,etc. causados pelas cores e as suas combinações.

Já parou para pensar porquê as cores do semáforo são vermelho, verde, e amarelo?

  • O vermelho dá o sentimento de perigo, cuidado, e até mesmo, um pouco de medo.

  • Verde lembra paz, esperança, continuidade, ciclo, e certo.

  • E o amarelo lembra cautela, atenção e cuidado.

Então de forma básica, a teoria das cores é a relação das cores com os sentimentos, e como manipular sentimentos utilizando cores.

Como a teoria das cores pode ser aplicada no frontend?

Podemos escolher as cores dos nossos sites com a teoria das cores em base, buscando dar mais identidade ao site, e também combinar as cores buscando dar uma "vibe" específica ao site.

Vamos supor que estamos desenvolvendo um site de um hortifruti, que quer dar uma impressão de fresco, natural, relaxante, calmo,etc. No seu site. Como podemos fazer isso utilizando a teoria das cores?

Para provocar todos esses sentimentos que listamos acima, podemos escolher cores mais próximas do espectro verde, amarelo, marrom e ciano, pois:

  • Amarelo representa a positividade, boa sorte, e alegria.
  • Verde lembra esperança, cura, paz e equilíbrio.
  • E azul lembra purificação, amabilidade, paciência e serenidade.

Logo, utilizando essas cores em nosso site, poderemos fornecer esses sentimentos reconfortantes que um site de um hortifruti iria precisar.

Ah, mas você disse que amarelo lembrava cautela, atenção, e agora tá dizendo que lembra positividade e alegria?

Sim, porque o sentimento das cores depende do contexto que elas estão sendo utilizadas., numa combinação de verde, ciano, marrom e outras cores próximas, amarelo trará um sentimento mais positivo, que em uma combinação de verde e principalmente, vermelho.

Algumas cores e seus significados

Algumas cores que podemos atribuir significados são:

  • Vermelho é paixão, entusiasmo, encontro entre pessoas. Estimula ações agressivas;
  • Amarelo é concentração, disciplina, comunicação, ativa o intelecto. Está associado a positividade e a boa sorte;
  • Laranja é equilíbrio, generosidade, entusiasmo, alegria. Além de ser atraente e aconchegante;
  • Verde é esperança, abundância, cura. Estimula momentos de paz e equilíbrio. É a cor da revelação, também representa a ganância.
  • Azul é purificação, expulsa energias negativas. Favorece a amabilidade, a paciência a serenidade. Estimula a busca da verdade interior;
  • Lilás é a cor que tem mais influencia em emoções e humores. Também está ligada a intuição e a espiritualidade;
  • Branco é purificador e transformador. Representa a perfeição e o amor divino. Estimula a imaginação e a humildade. Produz a sensação de limpeza e claridade, além de frieza e esterilidade;
  • Preto, pode ser representado como uma capa de aço, onde aquilo que está dentro não sai e aquilo que está fora não entra.
  • Rosa pode ser representado pela humildade e amizade

Logo, tenha em mente esses significados quando for utilizar a teoria das cores em algum projeto seu.

Lembrando que esses significados podem mudar ou ser enfatizados dependendo da combinação de cores que você utilizar, como no exemplo do amarelo.

Finalização

Nesse artigo você aprendeu um pouco sobre teoria das cores, e como aplicá-las em um projeto Frontend.

Muito obrigada por ler ❤️🏳️‍⚧️ e me segue nas redes, é tudo @lissatransborda 👀

Top comments (0)