Home / Design /

As melhores ferramentas de cores para web design

As melhores ferramentas de cores para web design

 

Um dos passos mais importantes no web design é a selecção de cores. Se esta for incorrecta, pode até perder uma oportunidade. É verdade, as cores que escolhemos podem ter um impacto psicológico naqueles que as visualizam.

Por exemplo, o vermelho é geralmente visto como uma cor energética, enquanto o azul transmite tranquilidade e paz. Para ilustrar esse ponto, considere as cores que pode utilizar em um site que vende brinquedos para crianças versus um site para um escritório de advocacia. As possibilidades são, optar por cores brilhantes e vibrantes para o primeiro e tons suaves de azul e cinza para o último.

Mas como saber quais as cores que funcionam melhor juntas? Felizmente, não precisa de ser um mestre em teoria das cores para montar uma paleta de cores viável. Para ajudar com esta importante tarefa de selecção de cores, neste artigo partilho algumas das melhores ferramentas de cores gratuitas na web.

 

As 12 melhores ferramentas para ajudá-lo a desenvolver a paleta de cores perfeita no seu projecto de web design.

 

1. HueSnap

A inspiração pode surgir a qualquer momento. Pode ser uma decoração de um quarto de hotel ou até mesmo a luz do parque em uma noite que gera a inspiração para o esquema de cores do próximo projecto de web design. Quando isso acontecer, o HueSnap está é definitivamente a melhor opção para o ajudar. Através da captura de uma fotografia o HueSnap vai extrair as cores existentes nessa imagem e transformá-las em uma paleta.

O aplicativo é adaptado para uso móvel, e pode salvar e compartilhar as suas paletas com outras pessoas. Há diversos recursos para o ajudar a modificar a paleta, tais como opções para escolher cores complementares e compostas, e as suas paletas podem ter até seis cores cada.

 

2. Khroma

Khroma é uma ferramenta de cores IA poderosa, que tem como objectivo ajudar o usuário a navegar facilmente e comparar combinações de cores originais. Com isso, os usuários personalizam um “algoritmo de IA” para agir como uma extensão de seu cérebro. Os usuários começam por escolher 50 cores de que gostam e essas cores são usadas para determinar uma rede neural capaz de reconhecer centenas de milhares de outras cores semelhantes. Saiba mais sobre o Khroma.

 

3. Coolors.co

Coolors.co oferece uma ampla variedade de ferramentas para ajustar a paleta de cores da forma que quiser. Além disso, pode exportar a sua criação final em muitos formatos diferentes para que possa usá-la virtualmente onde quiser.

O Coolors.co não é apenas uma ferramenta para criar uma paleta de cores, mas também permite visualizar criações de outros usuários para que se possa inspirar. A secção Explorar tem centenas (senão milhares) de paletas que pode ver, salvar e editar. Melhor ainda, o Coolors.co está disponível para computadores de mesa, como aplicativo para iOS, como complemento do Adobe Photoshop e do Illustrator e até mesmo uma extensão do Google Chrome para facilitar o acesso. WOW!

 

4. Adobe Color CC

O Adobe Color CC já existe há algum tempo e é uma das melhores ferramentas de cores para escolher uma paleta de cores e gratuita! Pode criar as suas próprias paletas de cores e também explorar paletas criadas por outros utilizadores.

Basta seleccionar uma cor na roda ou em uma imagem e aplicar as directrizes de cores, tais como: cores complementares, cores monocromáticas ou sombras da cor seleccionada e assim gerar uma paleta de cores. Ou apenas, clique em cada cor e explore a roda de cores para personalizar a sua selecção. Como bónus adicional, pode salvar os temas criados na sua biblioteca da Adobe.

 

5. Colordot

A Colordot de hailpixel é uma excelente ferramenta online e gratuita para criar uma paleta de cores. Com os movimentos simples do mouse, pode seleccionar e salvar cores. Mova o mouse para frente e trás para matiz; cima e baixo para suavizar; role para saturação e clique para salvar uma cor na paleta. Clique no ícone roda dentada para ver as cores RGB e HSL. A Colordot também tem disponível um aplicativo iOS que permite capturar cores através da sua câmera.

 

6. Eggradients

Eggradients oferece ideias para gradientes bonitos para utilizar no seu projecto de web design, esta ferramenta é o resultado de alguém com um grande olho para a cor e com um senso de humor interessante. Cada gradiente, exibido em forma de ovo, vem com o seu próprio nome instigante.

 

7. 147 Colours

Quando é o responsável por desenvolver o CSS de fácil leitura, às vezes, usar cores padrão e nomes de cores é o caminho certo. Mas, graças ao 147 Colours desenvolvido por Brian Maier Jr, pode agora ter um vislumbre de todas as cores padrão e escolher aquelas que funcionam melhor.

   

O 147 Colours contém as 17 cores padrão, além de outros 130 nomes de cores CSS. Filtre os resultados ou escolha entre o arco-íris completo de 147 cores.

 

8. Canva Color Palette Generator

O Canva Color Palette Generator é perfeito se deseja criar uma paleta de cores com base em uma determinada imagem. Embora outras ferramentas ofereçam opções semelhantes, o Canva é super simples e intuitivo de utilizar: faz o upload de uma imagem e o gerador retornará uma paleta das cinco cores principais contidas nela. Pode clicar nas cores que lhe agrada e copiar o valor HEX para sua área de transferência.

Infelizmente, é aí que a utilidade da oferta do Canva termina, já que isto é tudo o que pode fazer com seu gerador de paleta de cores, não pode por exemplo ajustar as cores da paleta. As únicas outras opções que tem são copiar os valores HEX fornecidos ou carregar outra foto.

 

9. Paleta de Cores – Material Design

Com a Paleta de Cores – Material Design, pode seleccionar duas cores, que são convertidas em uma paleta de cores para download.

A empresa também disponibiliza a Material Design Colors, permite aos designers ver os diferentes tons de uma cor, juntamente com seus valores HEX.

 

10. ColourCode

ColourCode de Tamino Martinius e Andreas Storm é semelhante ao Colordot, mas oferece um pouco mais de orientação. Esta ferramenta gratuita, mostra um fundo que muda de cor com o movimento do mouse. Além disso, esta ferramenta oferece diferentes categorias para a paleta (analógica, tríade, quadra, monocromática, luz monocromática e etc).

Com o ColourCode, pode definir diferentes opções ao longo da roda de cores para criar uma combinação original. Pode também salvar a sua paleta ou exportá-la como um arquivo SCSS, LESS ou até mesmo exportar para PNG, se assim o desejar.

 

 

11. Código de Cores HTML

Esta ferramenta gratuita HTML Color Codes da Dixon & Moe inclui um selector de cores detalhado com muitas referências sobre as regras de cores; uma série de gráficos coloridos, esquema de design com material do Google e a clássica paleta de cores segura para a web e uma lista de códigos e nomes de cores HTML padrão.

Esta ferramenta HTML Color Codes também disponibiliza tutoriais e outros recursos para web design, além de opções como exportar os resultados em HEX, HTML, CSS e SCSS.

 

12. W3Schools: Tutorial de Cores

Se está procurando uma solução completa que inclua um guia de cores, o Tutorial de Cores da W3Schools é a escolha perfeita.

Aqui, não só pode aprender sobre teoria das cores, mas também pode utilizar outras ferramentas que possui, como o Color Converter. Com esta ferramenta vai conseguir converter qualquer cor, nome, código HEX ou valores RGB, HSL, HWB e CMYK.

 

BONUS. Medidor de cor digital (Mac)

Muito bem! Para os utilizadores de Mac … esta é para si. Com a ferramenta Digital Color Meter ( Medidor de Cor Digital ) integrada na sua máquina, pode ‘picar’ uma cor de qualquer lugar da tela e, em seguida, obter os valores como um decimal, hexadecimal ou percentagem. Além disso, pode até ‘copiar’ a cor seleccionada.

 

Gostou deste artigo? Compartilhe a sua opinião!

 


Escolha qual o assunto de interesse que pretende receber no seu email.




 

Partilhar este artigo

Deixe um comentário

O seu endereço de email não será publicado. Campos obrigatórios marcados com *