Paleta de cores do Google Material Design para seu Website

material-design Design Material
Material Design

Introdução

Material Design do Google é um sistema unificado que combina teoria, recursos e ferramentas para elaborar experiências digitais.

O sistema serve como uma metáfora para racionalizar o design e a implementação. 

Estabelece uma linguagem compartilhada para ajudar as equipes a unir estilo, branding, interação e movimento sob um conjunto de princípios coesos.

As cores no Material Design são inspiradas por matrizes arrojados justapostos com ambientes silenciosos. Uso de sombras profundas e destaques brilhantes.

Uma técnica para criar sua paleta Material é o método análogo. A combinação mais simples. Utilize três cores que são relativamente próximas uma da outra na paleta de cores. A soma dos ângulos deve ser inferior a 90 graus.

Lembre-se de testar se o seu tema Material respeita elementos do contraste. Você deve levar em consideração pessoas de baixa visão. Para mais informações visite w3c.

Vejamos então neste post algumas ferramentas online para você criar seu tema Material Design para Website, APP ou outros.

#edd9c0

#c9d8c5

#a8b6bf

#7d4627

ferramentas para criar seu tema material

  • http://www.materialpalette.com – Nesta ferramenta, você começa escolhendo sua cor primária e cor de contraste. Posteriormente, ele irá mostrar uma visualização ao vivo da paleta de cores gerada e oferecer-lhe uma variedade de maneiras de fazer o download.
  • http://www.materialui.co/colors  – É uma folha de estilo que apresenta todas as cores em uma página.
  • https://www.materialpalette.com/colors – Uma ferramenta para visualizar  a paleta de cores. Mostra as cores primárias lado a lado. Clicando em uma “barra de cores” mostra todas as amostras de cores associadas a essa cor.
  • http://tintui.com/ – Esta ferramenta exibe apenas o 500 cores do Material.

Dicas

As cores não são apenas números de vermelho, verde e azul, que podemos simplesmente colocar um computador e obter resultados.

Na verdade, é realmente difícil encontrar as cores certas para o design usando um seletor de cores.

Imagens da natureza sempre foram uma ótima fonte de inspiração para o design!

Uma dica para encontrar grandes combinações de cores, se é fechar seu seletor de cores e abrir fotos de paisagens, plantas, flôres, mar e o céu.

Happy Coding! 😀

Comments are closed.