Desvendando as cores: Um guia para os que acreditam que o mundo é apenas em preto e branco
Tags: cores, paleta, ui, ux
Published: 2023-07-17 19:00:00

As cores estão presentes no nosso cotidiano e mesmo que involuntariamente tem capacidade de comunicar, expressar, influenciar, sinalizar e identificar. Ela trás uma experiência sensorial que nos acompanha a todo momento, se tornando uma linguagem visual tão poderosa que muitas vezes ultrapassa a comunicação verbal. Esse fenômeno quem pode explicar é a psicologia das cores. Através dela podemos entender como, porque e por qual motivo aquelas cores foram utilizadas. Veja alguns significados a seguir:

![Psicologia das cores](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jdf5l32ecqbyjj2ymeil.png)

#A paleta de cores perfeita...
O uso estratégico das cores pode criar uma identidade visual marcante, estabelecendo uma conexão instantânea com o público-alvo. Pensando nisso, eu criei um método para a criação de uma paleta de cores. Segue o passo a passo:

1° Passo - Definir as cores de base: Por serem neutras, sempre inicio com preto e branco, elas são curingas e podem ser usadas tanto em detalhes como em textos criando bons contrastes e não deixando a leitura cansativa.

2° Passo - Definir a cor principal: Escolho 1 cor como principal, faço isso de acordo com a área do projeto buscando referências e padrões já usados.

3° Passo - Aplicar a teoria das cores: Escolhido a cor principal, aplico a teoria das cores para escolher mais algumas cores para compor a paleta. Existem vários caminhos a seguir, algumas opções são:

- Harmonia monocromática: são variações de uma mesma cor, obtidas pela adição de branco, cinza ou preto na cor escolhida.
- Harmonia análoga: aquelas que estão próximas umas das outras no círculo cromático e geralmente criam uma boa harmonia e coesão na junção.
- Harmonia complementar: aquelas que estão diretamente opostas no círculo cromático e oferecem um forte contraste entre si.
- Harmonia triádica: combinação de cores que utiliza um esquema de cores equidistantes no círculo cromático. Essas três cores formam um triângulo no círculo cromático e oferecem um equilíbrio visual agradável.

![Teoria das cores](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oz5to50mbbxvmxplsq1v.png)

#Aplicando o método
Agora que já temos os passos do método vamos aplicar... mas de uma forma diferente. Ao invés de criar uma nova paleta de cores trabalharemos com a análise de um projeto já pronto. Nesse caso será o site de uma clínica odontológica. Veja as imagens a seguir e vamos analisar.

![Home](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y8oa3myqr6i3t8jtmsfn.png)

![Banner 1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/irwhz3yamj93cs25l1da.png)

![Banner 2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9k97y2m2loblertian8y.png)

![Rodape](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gbjx185oksqjesntekst.png)

Depois de analisar as imagens podemos seguir com o passo a passo.

1° Passo: Analisando o site podemos ver de cara que o branco e o preto são usados como cor de base, principalmente em textos.

2° Passo: Aqui a cor principal sem dúvidas é o azul, porém é nítido que que o azul mais usado é o que tem tom de céu. Ele está em 100% dos botões, links e áreas de destaque. Grandes chances desse azul bastante presente seja uma relação ou referência a área da saúde.

3° Passo: Aplicando a teoria das cores é perceptível que o designer que montou essa cartela brincou com as harmonias utilizando os tons monocromáticos do azul como o ciano que foi aplicado em alguns detalhes e ícones, e o tom mais escuro foi utilizado em áreas onde temos grande concentração de informação e aplicou a harmonia por contrate na cor laranja para botões de função parecida mostrando que não existe regra e que podemos usar mais cores desde que cada uma realmente represente e tenha uma função. 

Assim, depois de analisar o site a paleta de cores ficou assim

![Paleta completa](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jr15vce34cza2w9t9ycq.png)

As cores desempenham um papel essencial no design, elas não estão lá só para deixar colorido ou mais despretensioso, existe uma função, um porquê e eu espero que nesse pequeno texto eu tenha conseguido explicar e mostrar sua devida importância. E agora que já entendemos que as cores tem significados e como montar uma paleta equilibrada e coerente com cada tipo de projeto, como representá-las? (Spoiler do próximo texto :D)