Nossos monitores de vídeo trabalham com o sistema de cores RGB (red-green-blue), onde valores entre 0 e 255 de vermelho, verde e azul são combinados para formar todos os tons de cores na tela. Por exemplo, a cor amarela é formada por 100% de vermelho, 100% de verde e 0% de azul, ou 255,255,0. Porém, quando trabalhamos com HTML ou CSS, as cores são utilizadas no sistema hexadecimal (com base 16). Por isso, você provavelmente conhece melhor o amarelo como #FFFF00.

Antigamente, os monitores só suportavam 256 cores, o que limitava a quantidade de tons disponíveis. Hoje em dia os monitores modernos trabalham com milhões de cores, mas mesmo assim ainda existem as cores seguras para web.

Web safe, como também são chamadas, são as cores formadas pela combinação das 3 cores RGB nas intensidades 0% (0), 20% (51), 40% (102), 60% (153), 80% (204) e 100% (255) ou, em hexadecimal, 00, 33, 66, 99, CC e FF, respectivamente. No meu portfolio você encontra uma tabela com todas as cores web safe possíveis e seus códigos em hexadecimal.

Algumas cores têm nomes atribuídos pelo W3C, que são reconhecidas por qualquer navegador. São elas:

white #FFFFFFs	silver #C0C0C0	gray #808080	black #000000
aqua #00FFFF	teal #008080	fuchsia #FF00FF	purple #800080
blue #0000FF	navy #000080	lime #00FF00	green #008000
yellow #FFFF00	olive #808000	red #FF0000	maroon #800000

Assim, em HTML você pode utilizar qualquer uma das opções:

<font color="red">
<font color="#FF0000">

Já em CSS, as cores web safe podem ser "resumidas": FF pode ser substituído por F, 33 por 3 e assim por diante. Portanto temos as seguintes possibilidades:

{color: lime;}
{color: #00FF00;}
{color: #0F0;}

E as outras cores?

Como eu disse, os monitores hoje em dia trabalham com milhões de cores. Em alguns casos, queremos utilizar outras cores que não estão na palheta do nosso editor de imagens em RGB, mas não fazem parte da palheta web safe. Como utilizar essa cor?

Para descobrir o valor RGB de uma cor, utilize seu editor de imagens preferido:

 

           

 

A maneira mais fácil é aprender a fazer o cálculo para converter RGB em hexa. É simples e pode ser feito, por exemplo, com a Calculadora do Windows. Se a sua calculadora só tiver as operações básicas, no menu "Exibir" escolha "Científica". Sua calculadora vai ficar com a seguinte aparência:

 

 

Aqui no exemplo eu tenho, em RGB, a cor 227,95,54. Para transformá-la em hexa, basta digitar cada valor na calculadora e clicar no botão "Hex":

 

Assim, 227 em hexadecimal é E3.

Clique em "Dec" para voltar ao sistema decimal e repita a operação com os outros dois valores. Para 95, teremos 5F, e para 54 temos 36 em hexa. Assim, o que em RGB é (227,95,54) se transforma em #E35F36, o que corresponde a esta cor.

Mesmo que alguns sites fiquem melhores com cores especiais, sempre que possível tente utilizar cores web safe: como sempre digo, vale a pena tomar algum cuidado com a acessibilidade. Não se esqueça também que alguns usuários têm necessidades especiais e só conseguem, por exemplo, enxergar cores em alto contraste. Neste caso, tire um print screen do seu trabalho, transforme-o em tons de cinza no seu editor de imagens e cheque se textos e imagens continuam visíveis.

Erika Sarti é web designer e trabalha como free-lancer desde 2000. É a responsável pelo novo layout do InfoWester, basicamente feito com tableless, um de seus assuntos preferidos. Seu portfólio está em www.erikasarti.net.