A algum tempo atrás, cirei um post falando sobre as combinações de cores e seu web site e hoje resolvi
explicar a formação...
Tomando a imagem acima como legenda, vamos começar os cálculos, primeiramente o Vermelho, temos os
algarismos 9 e 5, nossa...
Agora para entender como melhor manipular as cores, temos nosso painel no photoshop, trabalharemos
agora com HSB, Hue / Sa...
Espero que tenham entendindo e em breve irei explicar sobre CMYK e Lab. Enjoy
Google
Página Inicial
Copyright © 2013 www.T...
Próximos SlideShares
Carregando em…5
×

Hexadecimal cores

215 visualizações

Publicada em

Hexadecimal cores

Publicada em: Design
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
215
No SlideShare
0
A partir de incorporações
0
Número de incorporações
4
Ações
Compartilhamentos
0
Downloads
2
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Hexadecimal cores

  1. 1. A algum tempo atrás, cirei um post falando sobre as combinações de cores e seu web site e hoje resolvi explicar a formação dos códigos das cores e como melhor manipular-las. Existe um pequeno requisito na facilidade de cálculos matemáticos, mas nada que uma calculadora não resolva xD. Como todos já devem saber, as cores web em hexadecimal são aquelas precididas do “#” (joguinho da velha, tralha, sustenido e etc). Os demais números na realidade, são parte de uma pequena equação matemática para a construção das cores em RGB, também existe o CMYK, mas, ele é mais usado em trabalhos de imprenssões, ao contrário do RGB que é extramamente usado na web. A sigla RGB representa as cores, Red (Vermelho representado pela letra R) Green (Verde representado pela letra G) Blue (Azul representado pela letra B). No hexadecimal existem 6 caracteres, na realidade, as cores vão em dupla, tomando como exemplo a cor #95b604 (este verde), vemos que o 95 seria o vermelho, b6 o verde e 04 o azul, a equação dos pares equivalem a um valor que varia de 0 a 255. Quanto menor o valor, mais escuro será a cor e quanto mais 255 mais forte e intensa será. E agora você se perguntar, porque das letras? A resposta é simples, cada caractere é uma pequena variação de 0 a 15, mas como do 10 a 15 possuem dois algarismos, então, foram trocados por letras, ou seja, cada caractere terá um valor de 0 a 15, em 16 variações. Veja a figura abaixo para o entendimento maior do que foi explicado. Entendendo as formações de cores hexadecimais para webEntendendo as formações de cores hexadecimais para web 1212 fevfev Página InicialPágina Inicial ContatoContato PortfolioPortfolio http://the-creators.com.br/entendendo-as-formacoes-de-cores... 1 de 4
  2. 2. Tomando a imagem acima como legenda, vamos começar os cálculos, primeiramente o Vermelho, temos os algarismos 9 e 5, nossa equação é a seguinte,”Primeiro caracter x 16 + segundo caracter = ?” ou seja “9 x 16 + 5 = 149″. Então no vermelho teriamos o valor 149, no verde temos “11 (valor de B) x 16 + 6 = 182″. E no azul teriamos “0 x 16 + 4 = 4″. Misturando os valores e adicionando em seus respectivos lugares, teremos nosso verde como mostra a figura abaixo: Página InicialPágina Inicial ContatoContato PortfolioPortfolio http://the-creators.com.br/entendendo-as-formacoes-de-cores... 2 de 4
  3. 3. Agora para entender como melhor manipular as cores, temos nosso painel no photoshop, trabalharemos agora com HSB, Hue / Saturation / Brightness. Vejam a figura abaixo com o nosso verde e vamos ao entendimento: No eixo X trabalharemos os valores do Saturation (saturação) ou seja, a intensidade e força da cor. No eixo Y trabalharemos os valores do Brightness (brilho) ou seja, mais clara ou mais escura. No canto direito temos a barra de Hue (matiz) onde mudaremos a nossa cor. Os valores da saturação e brilho são trabalhados em porcentagem (%), igual a matemática onde pra cima e direita são os valores maiores, esquerda e abaixo os menores. Já na matiz, usa-se os valores em graus (°) pq Página InicialPágina Inicial ContatoContato PortfolioPortfolio http://the-creators.com.br/entendendo-as-formacoes-de-cores... 3 de 4
  4. 4. Espero que tenham entendindo e em breve irei explicar sobre CMYK e Lab. Enjoy Google Página Inicial Copyright © 2013 www.The-Creators.com.br - Todos os direitos reservados. « Cores e seu website, como combinar. Logo, logotipo ou logomarca? » 1 comentário Classificar por Sorymar Conceição Teixeira Soares · Biologia Bacharel barbabara conceição prazeras teira fotoo Curtir · Responder · 6 de março de 2013 19:48 Facebook Comments Plugin PrincipaisPrincipais Adicionar um comentário... Página InicialPágina Inicial ContatoContato PortfolioPortfolio http://the-creators.com.br/entendendo-as-formacoes-de-cores... 4 de 4

×