Web design: use o código de cor hexadecimal para combinar cores

Video: TABLELESS PARA WEB DESIGNERS: Como funciona o código hexadecimal de cor?

Ao especificar as cores em HTML ou código CSS em web design, você não&rsquo-t usar seus números RGB. Em vez disso, você usa uma coisa chamada código hexadecimal. Por exemplo, branco velho liso é 255,255,255 em RGB, mas é #FFFFFF em código hexadecimal. No código hexadecimal, os dois primeiros dígitos definir a cor vermelha, os próximos dois dígitos definir o verde, e os dois últimos dígitos definem o azul do sistema RGB. Usando o exemplo #FFFFFF, os primeiros dois dígitos FF igual a 255. Portanto, esta cor é de R = 255, G = 255 e B = 255. Todas as três cores na potência máxima (255) fazer branco.

Imagine que você&rsquo re-desenhar um site para uma empresa que tem um punhado de cores da empresa que eles querem que você use todo o site. Muitas vezes, essas cores são especificados como cores PMS (Pantone Matching Sistema). Então, como você vai de PMS ou RGB para códigos de cores hexadecimais?

Em vez de usar um anel decodificador super-duper para traduzir valores de cor em código hexadecimal e vice-versa, você pode recuperar o código em ambos os Adobe Photoshop e Adobe Fireworks. (Caso contrário, você realmente precisa de uma calculadora hexadecimal especial, e eles existem online!)

Aqui&rsquo-s como usar o Adobe Photoshop para encontrar o número hexadecimal de uma cor de amostra, ou de um PMS conhecidos ou cor RGB:

  1. Inicie Photoshop.

  2. Escolha Arquivo → Abrir na barra de menu.

    Navegue até uma imagem que você quiser experimentar uma cor e abri-lo.

    Se você não&rsquo-t tem uma imagem de amostra e só precisa traduzir um RGB ou valor de cor PMS, você não precisa abrir um arquivo.

  3. Clique na amostra de cor de primeiro plano na parte inferior do painel Ferramentas.

    Uma paleta pop-up aparece, oferecendo um seletor de cores para você usar, como a figura a seguir ilustra. Nota-se também que o cursor se transforma em um conta-gotas.



  4. Mova o cursor sobre a imagem e clique na cor que você quiser experimentar.

    Observe as atualizações de leitura hexadecimal no Color Picker.

  5. Selecione e copie o código hexadecimal dentro do Color Picker antes de clicar no botão OK para sair, em seguida, cole o código em seu código CSS ou em seu guia de estilo.

  6. Para traduzir uma cor PMS, faça o seguinte:

  1. Clique no botão Bibliotecas cor no seletor de cores.

  2. digitar rapidamente o seu número de PMS, digamos 375, para ver a sua amostra de cor aparecem.

  3. Quando você encontrar o caminho certo na lista, clique no &ldquo-Picker&botão rdquo- para retornar ao Color Picker.

    Video: Tutorial Adobe Illustrator CC: Color web | video2brain.com

    Observe o código hexadecimal aparece para sua cor- agora você pode copiar e colá-lo como quiser.

  • Para traduzir uma cor RGB, basta digitar o R, G, e os valores B no Color Picker e veja a atualização número hexadecimal em conformidade.


  • Publicações relacionadas