<http://schema.org/articleBody>
"Quantas vezes na sua vida voc\u00EA j\u00E1 se deparou com um c\u00F3digo hexadecimal? A gente sabe que seu Command-C t\u00E1 em um relacionamento s\u00E9rio com ele. Mas afinal, como que um punhado de letras e n\u00FAmeros representam essa tralharada de cores (ou o que quer que seja) que n\u00F3s vemos por a\u00ED nos dispositivos digitais?\r\n\r\nExiste um artigo \u00F3timo no Tableless explicando tudo o que voc\u00EA precisa saber sobre cor &lt;a href=\"http://tableless.com.br/sobre-cor-e-webdesign/\" target=\"_blank\"&gt;aqui&lt;/a&gt;. S\u00E9rio, vai l\u00E1, mas depois volta aqui.\r\n\r\nO hexadecimal \u00E9 um sistema com base 16. N\u00E3o ajudou em nada? Ent\u00E3o vamos voltar para os tempos de escola e relembrar como funciona o sistema decimal que utilizamos todos os dias. Caso voc\u00EA se perguntou \u201Cmas por que o decimal?\u201D. Porque n\u00F3s temos dez dedos e fica relativamente f\u00E1cil de realizar os c\u00E1lculos. Foi o que os hindus disseram l\u00E1 pelo ano\u00A0400 AC.\r\n\r\nSe eu lhe mostrar qualquer n\u00FAmero, tenho certeza que voc\u00EA consegue identificar num piscar de olhos. O n\u00FAmero &lt;b&gt;2015,\u00A0&lt;/b&gt;por exemplo. Voc\u00EA n\u00E3o teve nenhum esfor\u00E7o e leu \u201Cna sua cabe\u00E7a\u201D &lt;i&gt;dois mil e quinze&lt;/i&gt;, certo? Legal. Vamos esmiu\u00E7ar como chegamos a essa conclus\u00E3o. O sistema decimal trabalha com base 10. De novo esse neg\u00F3cio de base? Vamos l\u00E1:\r\n\r\n&lt;b&gt;Sistema decimal: &lt;/b&gt;\r\n\r\nComo sugere o nome, esse sistema trabalha com 10 s\u00EDmbolos: 0, 1, 2, 3, 4, 5, 6, 7, 8 e 9.\r\n\r\nVoc\u00EA provavelmente tem em sua mem\u00F3ria lembran\u00E7as de alguns conceitos como: unidade, dezena, centena e milhar.\r\n\r\n&lt;img class=\"aligncenter wp-image-49638 size-full\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/unidade.jpg\" alt=\"valor decimal\" width=\"229\" height=\"69\" /&gt;\r\n\r\nCada algarismo possui a base 10 elevada a uma pot\u00EAncia de valor crescente, come\u00E7ando em zero da direita pra esquerda. Vemos que o primeiro algarismo posicionado \u00E0 direita \u00E9 a representa\u00E7\u00E3o da unidade. A base \u00E9 10 e a pot\u00EAncia \u00E9 0. Qualquer n\u00FAmero elevado a zero o resultado \u00E9 1. Como eu sei que voc\u00EA sabe trabalhar com pot\u00EAncias, n\u00E3o vou ficar explicando o que \u00E9 dez ao quadrado, certo?\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49645\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/101.jpg\" alt=\"base dez\" width=\"227\" height=\"105\" /&gt;\r\n\r\nAgora \u00E9 s\u00F3 multiplicar o resultado da base com o algarismo em quest\u00E3o. Voltando ao exemplo da unidade, temos o seguinte: 1 x 5 = 5. A l\u00F3gica se aplica para todos os outros.\r\n\r\n&lt;a href=\"http://tableless.com.br/wp-content/uploads/2015/06/10-resultado.jpg\"&gt;&lt;img class=\" size-full wp-image-49622 aligncenter\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/10-resultado.jpg\" alt=\"sistema decimal\" width=\"215\" height=\"235\" /&gt;&lt;/a&gt;\r\n\r\nOlha l\u00E1 o n\u00FAmero em que n\u00F3s chegamos somando todos os resultados: 5 + 10 + 0 + 2000 = 2015. Bacana, n\u00E9? Ent\u00E3o vamos para o pr\u00F3ximo.\r\n\r\nAntes de chegar no sistema hexadecimal temos que passar pelo sistema bin\u00E1rio. Mas j\u00E1 que recapitulamos o sistema decimal, vai ser facinho entender o bin\u00E1rio, fique tranquilo.\r\n\r\nN\u00E3o tenho d\u00FAvidas que voc\u00EA j\u00E1 ouviu o termo bit. At\u00E9 porque voc\u00EA est\u00E1 lendo esse artigo atrav\u00E9s da web e teve que contratar um servi\u00E7o de internet para isso, seja ele qual for. Vamos supor que tenha sido um que forne\u00E7a a velocidade de download de 30Mbps. T\u00E1 vendo esse \u201Cb\u201D a\u00ED no meio? Ele significa bit, no caso: 30 Mega bits por segundo, quando falamos de bit o \u201Cb\u201D \u00E9 em caixa baixa. Caso voc\u00EA ache que escreveu errado a vida toda, at\u00E9 porque se voc\u00EA fala para algu\u00E9m que seu arquivo tem 30MB, n\u00E3o est\u00E1 errado. Voc\u00EA est\u00E1 se referindo a 30 Mega Bytes, a\u00ED sim o \u201CB\u201D \u00E9 em caixa alta.\r\n\r\nQuer dizer que se eu tenho uma velocidade de 30Mbps eu consigo baixar um arquivo de 30MB em 1 segundo? Calma l\u00E1, j\u00E1 vamos chegar nisso.\r\n\r\n&lt;b&gt;Sistema Bin\u00E1rio: &lt;/b&gt;\r\n\r\nO significado de bit \u00E9 &lt;b&gt;Bi&lt;/b&gt;nary Digi&lt;b&gt;t&lt;/b&gt; (D\u00EDgito Bin\u00E1rio), serve para medir dados de informa\u00E7\u00E3o computacional. Utilizado em computadores por causa dos transistores, que s\u00E3o reunidos em circuitos e possibilitaram a cria\u00E7\u00E3o de micro computadores, que substitu\u00EDram aqueles que ocupavam uma casa inteira, literalmente. Os transistores controlam o fluxo de corrente el\u00E9trica, podendo estar ligados &lt;b&gt;ou&lt;/b&gt; desligados, quer dizer, passando corrente el\u00E9trica ou n\u00E3o, sendo assim, duas op\u00E7\u00F5es. J\u00E1 que s\u00E3o duas op\u00E7\u00F5es, utilizamos o sistema &lt;b&gt;bi&lt;/b&gt;n\u00E1rio.\r\n\r\nQuer dizer que o computador que est\u00E1 na minha mesa, o tablet que est\u00E1 na minha mochila e o celular que est\u00E1 no meu bolso s\u00E3o compostos por transistores? Sim, ali\u00E1s, um monte deles.\r\n\r\nPara que n\u00E3o pare\u00E7a muito confuso, vamos associar o transistor a uma l\u00E2mpada. Se n\u00E3o h\u00E1 passagem de corrente el\u00E9trica a l\u00E2mpada est\u00E1 desligada, se h\u00E1, ela est\u00E1 ligada. No sistema bin\u00E1rio a l\u00E2mpada \u00E9 um bit e a representa\u00E7\u00E3o do \u201Cdesligado\u201D \u00E9 o d\u00EDgito &lt;b&gt;0 &lt;/b&gt;e do \u201Cligado\u201D o &lt;b&gt;1&lt;/b&gt;.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49630\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/lampada_animada.gif\" alt=\"l\u00E2mpada representando um bit\" width=\"104\" height=\"236\" /&gt;\r\n\r\nO que temos de informa\u00E7\u00E3o nos computadores s\u00E3o combina\u00E7\u00F5es desses dois d\u00EDgitos. Cada caractere que eu escrevo agora, por exemplo, cont\u00E9m alguns bits para ser armazenado.\u00A0Os bits s\u00E3o colocados em grupos de oito e s\u00E3o chamados de Byte.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49621\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/8bits1byte.jpg\" alt=\"ilustra\u00E7\u00E3o de l\u00E2mpadas representando um bit\" width=\"579\" height=\"165\" /&gt;\r\n\r\nVamos voltar \u00E0 hist\u00F3ria da conex\u00E3o de internet de 30Mbps. O que queremos saber \u00E9 quantos Bytes, e n\u00E3o bits por segundo nossa conex\u00E3o realiza o download de arquivos. Para isso basta dividir por 8. No caso: 30/8 = 3.75. Com uma conex\u00E3o de 30Mb por segundo conseguimos baixar no m\u00E1ximo at\u00E9 3.75MB por segundo. Claro que esse n\u00FAmero varia por n fatores externos. Ficando claro que n\u00E3o conseguir\u00EDamos baixar o arquivo de 30MB em apenas 1 segundo.\r\n\r\nVimos que no sistema &lt;b&gt;dec&lt;/b&gt;imal a base \u00E9 10, aqui no sistema &lt;b&gt;bi&lt;/b&gt;n\u00E1rio a base \u00E9 2. A l\u00F3gica \u00E9 a mesma.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49620\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/2.jpg\" alt=\"valores da base dois\" width=\"384\" height=\"49\" /&gt;\r\n\r\nCom o tempo voc\u00EA acaba decorando esses valores. Assim como fizemos com o sistema decimal, vamos esmiu\u00E7ar tamb\u00E9m o sistema bin\u00E1rio. Nesse exemplo, vamos realizar a convers\u00E3o de um n\u00FAmero no sistema bin\u00E1rio para o sistema decimal.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49623\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/binario-decimal.jpg\" alt=\"convers\u00E3o de bin\u00E1rio para decimal\" width=\"512\" height=\"193\" /&gt;\r\n\r\nLegal, n\u00E9? O n\u00FAmero 01011010 em bin\u00E1rio \u00E9 o n\u00FAmero 90 em decimal. Vamos fazer o processo inverso agora, converter o n\u00FAmero decimal 90 para o sistema bin\u00E1rio. Para isso, n\u00F3s vamos realizar divis\u00F5es sequenciais sendo que o divisor \u00E9 o 2, por causa da base 2.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49627\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/divisoes-sequenciais.jpg\" alt=\"converter decimal com divis\u00F5es sequenciais\" width=\"322\" height=\"235\" /&gt;\r\n\r\nQuando o resto for 0 ou 1 n\u00F3s paramos por a\u00ED. Repare que nessas divis\u00F5es n\u00E3o nos interessam as casas decimais. Quando chegamos ao quociente 1, n\u00F3s paramos a divis\u00E3o. A leitura do n\u00FAmero bin\u00E1rio gerado pelas divis\u00F5es \u00E9 da direita pra esquerda, e o valor que atingimos foi: 1011010. Se voc\u00EA observou atentamente, viu que nosso n\u00FAmero bin\u00E1rio est\u00E1 com apenas 7 d\u00EDgitos, porque o n\u00FAmero decimal 90 apenas requer 7 bits para ser armazenado. N\u00E3o se incomode, se quiser represent\u00E1-lo como 8 bits basta colocar um 0 \u00E0 esquerda dele, resultando em: &lt;b&gt;01011010&lt;/b&gt;.\r\n\r\nAh, mas eu n\u00E3o gosto de fazer conta. Tudo bem, vamos fazer uma abordagem mais l\u00FAdica. Vamos supor que n\u00F3s temos 90 dinheiros, uma moeda que eu inventei, representado em apenas uma c\u00E9dula. O que gera uma dificuldade imensa para jogar no fliper, j\u00E1 que precisamos de trocado. Vamos na padaria e pedimos para que o atendente troque esses 90 dinheiros em c\u00E9dula por 90 dinheiros em moedas.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49626\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/dinheiro.jpg\" alt=\"ilustra\u00E7\u00E3o das moedas e c\u00E9dula\" width=\"475\" height=\"119\" /&gt;\r\n\r\nClaro que ele n\u00E3o vai te dar uma moeda de 128 dinheiros, at\u00E9 porque \u00E9 muito mais do que os 90 dinheiros em c\u00E9dula que temos. Na nossa convers\u00E3o bin\u00E1ria a moeda 128 n\u00E3o vai ser utilizada e a representamos com o d\u00EDgito 0. E a moeda 64, podemos utiliz\u00E1-la? Claro, qualquer valor em moeda que seja igual ou menor do que o valor em c\u00E9dula. Se utilizamos a moeda de 64, no bin\u00E1rio atribu\u00EDmos o d\u00EDgito 1. A l\u00F3gica se repete para o resto da conta, sendo:\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49625\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/dinheiro-conta.jpg\" alt=\"tabela com c\u00E9dula e valores em moedas\" width=\"340\" height=\"566\" /&gt;\r\n\r\nComo j\u00E1 acabamos de trocar nosso dinheiro e n\u00E3o vamos utilizar a moeda de valor 1 colocamos o valor 0 no bin\u00E1rio.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49624\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/dinheiro-binario.jpg\" alt=\"decimal para bin\u00E1rio ilustrado\" width=\"505\" height=\"207\" /&gt;\r\n\r\nSe voc\u00EA est\u00E1 se perguntando qual o valor m\u00E1ximo que conseguimos armazenar em 8 bits, a\u00ED vai: 11111111 (j\u00E1 que queremos o valor m\u00E1ximo, todos os bits tem que estar ligados), agora \u00E9 s\u00F3 somar todos os valores dos n\u00FAmero elevados: 1 + 2 + 4 + 8 + 16 + 32 + 64 + 128 = 255.\r\n\r\nAcrescentamos o n\u00FAmero zero nas possibilidades, resultando 256 (0 a 255) varia\u00E7\u00F5es de cor, por exemplo.\r\n\r\nSe voc\u00EA leu o artigo recomendado no come\u00E7o do post, j\u00E1 deve saber que os dispositivos digitais trabalham com o sistema de cor RGB, consistindo basicamente em uma emiss\u00E3o de tr\u00EAs luzes diferentes, que quando combinadas em valores espec\u00EDficos configuramos a cor desejada. O zero representa total aus\u00EAncia de luz. Temos n\u00EDveis intermedi\u00E1rios e, por fim, chegamos na emiss\u00E3o m\u00E1xima de luz com o valor 255.\r\n\r\nO sistema RGB significa: Red (vermelho), Green (verde) e Blue (azul). S\u00E3o as cores prim\u00E1rias que juntas no sistema aditivo trabalham melhor no ambiente digital.\r\n\r\nEm praticamente qualquer software de computa\u00E7\u00E3o gr\u00E1fica voc\u00EA vai encontrar uma paleta de cores. Nela voc\u00EA ter\u00E1 alguma coisa similar a isso:\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49632\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/rgb.jpg\" alt=\"paleta rgb\" width=\"320\" height=\"71\" /&gt;\r\n\r\nD\u00E1 pra ver como as coisas come\u00E7am a se encaixar? OIha a\u00ED novamente os valores 0 e 255. Quer dizer, sabemos que 0 a 255 (256) \u00E9 a capacidade de armazenamento de 8 bits (1 Byte). Se temos o valor zero, n\u00E3o temos emiss\u00E3o de luz do canal de cor espec\u00EDfico. Se os tr\u00EAs canais de cor estiverem em zero, sabemos que no sistema digital \u00E9 a representa\u00E7\u00E3o da cor preta, porque nenhum canal est\u00E1 emitindo luz.\r\n\r\nCom a adi\u00E7\u00E3o m\u00E1xima de todos os canais de cor (todos em 255) temos a cor branca, a cor luz como \u00E9 chamada no sistema RGB. Como deve ter imaginado, para saber quantas cores o sistema RGB suporta \u00E9 s\u00F3 multiplicar pela quantidade de canais: 256 x 256 x 256 = 16.777.216. Quer dizer que imagens de 8bpc (8 bits por canal) tem tudo isso a\u00ED de cor, em qualquer dispositivo digital.\r\n\r\nSe voc\u00EA \u00E9 daqueles que gosta de saber sempre o porqu\u00EA das coisas, tenho uma coisa simples e interessante pra te falar. Uma imagem digital bitmap \u00E9 composta por pixels (menor unidade gr\u00E1fica, como se fossem tijolos que comp\u00F5em as paredes da sua casa), at\u00E9 a\u00ED tranquilo. Como vimos, as combina\u00E7\u00F5es dos tr\u00EAs canais formam as cores que n\u00F3s desejamos. Numa imagem digital \u00E9 como se tiv\u00E9ssemos tr\u00EAs folhas vegetais sobrepostas, cada folha representando um canal de cor. Vamos supor que esse pixel a\u00ED embaixo seja um dos v\u00E1rios que comp\u00F5em uma imagem qualquer:\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49631\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/pixel.jpg\" alt=\"pixel e valores em seus canais\" width=\"204\" height=\"196\" /&gt;\r\n\r\nPra compor a cor laranja desse \u00FAnico pixel, em cada canal de cor teremos varia\u00E7\u00F5es de valores para que quando combinadas formem essa informa\u00E7\u00E3o. Como cada canal tem 8 bits e temos tr\u00EAs canais, fica claro o porqu\u00EA que chamamos de imagens de 24 bits. E tamb\u00E9m agora \u00E9 n\u00EDtido que precisamos de 3 Bytes para armazenar as informa\u00E7\u00F5es de um pixel s\u00F3.\r\n\r\nSe nossa imagem tiver a dimens\u00E3o de 600x400, endende-se que temos 600 pixels de largura e 400 pixels de altura, totalizando 240.000 pixels. Como cada um deles utiliza 3 Bytes para ser armazenado, fazemos a multiplica\u00E7\u00E3o: 240.000 x 3 = 720.000 Bytes. Agora, ningu\u00E9m vai chegar numa reuni\u00E3o e falar que a imagem do projeto tem 720.000 Bytes, n\u00E9? Bom, 1024 Bytes (2 elevado a 10\u00AA pot\u00EAncia) equivale a 1 Kilobyte. Dividindo 720.000 por 1024 temos o valor em KB: 720.000 / 1024 = 703,1 KB.\r\n\r\nComo j\u00E1 conhecemos o sistema bin\u00E1rio podemos finalmente trabalhar com o sistema hexadecimal.\r\n\r\nComo vimos at\u00E9 agora, o sistema decimal trabalha com a base 10 e o sistema bin\u00E1rio com a base 2. Para esses dois sistemas, j\u00E1 est\u00E1 claro o porqu\u00EA.\r\n\r\nO sistema hexadecimal utiliza a base 16, agora vamos ver do que se trata.\r\n\r\n&lt;b&gt;Sistema hexadecimal&lt;/b&gt;\r\n\r\nAmiiigo, voc\u00EA t\u00E1 cansado de ouvir o Galv\u00E3o falar de hexa, e sabe que significa seis. Nesse caso, s\u00E3o seis as letras utilizadas: A a F. O decimal voc\u00EA j\u00E1 sabe que s\u00E3o dez s\u00EDmbolos: 0 a 9. Isso mesmo o que voc\u00EA pensou: 6 + 10 = 16.\r\n\r\nN\u00E3o se assuste achando temos algo complicado pela frente, na verdade muito pelo contr\u00E1rio. O sistema hexadecimal veio pra facilitar a utiliza\u00E7\u00E3o do que j\u00E1 conhecemos, o sistema bin\u00E1rio.\r\n\r\nComo sabemos que toda estrutura computacional dos sistemas utiliza c\u00F3digo bin\u00E1rio para representar suas informa\u00E7\u00F5es, utilizamos o sistema hexadecimal justamente para compactar esse c\u00F3digo bin\u00E1rio e facilitar sua aplica\u00E7\u00E3o no dia a dia.\r\n\r\nCada s\u00EDmbolo em hexadecimal consegue representar quatro d\u00EDgitos no sistema bin\u00E1rio, o que seria 4 bits. A tabela abaixo mostra a representa\u00E7\u00E3o de mesmos valores em sistemas diferentes.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49639\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/tabela.jpg\" alt=\"tabela decimal, bin\u00E1rio e hexadecimal\" width=\"473\" height=\"621\" /&gt;\r\n\r\nPor enquanto n\u00E3o parece fazer muito sentido apenas olhando essa tabela, mas com certeza voc\u00EA est\u00E1 acostumado com o tripleto hexadecimal. Sabe aquele carinha que voc\u00EA copia do Photoshop e cola no seu CSS? Ent\u00E3o, \u00E9 o tripleto. Como foi explicado acima, um s\u00EDmbolo no sistema hexadecimal armazena 4 bits de informa\u00E7\u00E3o. Por\u00E9m, j\u00E1 vimos tamb\u00E9m que a cor no sistema digital utiliza 8 bits por canal. Ent\u00E3o vamos l\u00E1: 4 + 4 = 8. Consequentemente para representar um canal de cor do sistema digital precisamos de dois s\u00EDmbolos em hexadecimal. Como sabemos que temos tr\u00EAs canais de cor, precisamos exatamente do que voc\u00EA pensou: tripleto hexadecimal. Coloquei abaixo o c\u00F3digo hexadecimal que representa a cor branca, s\u00F3 por j\u00E1 estarem acostumados com ele.\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49633\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/tripleto.jpg\" alt=\"tripleto hexadecimal\" width=\"361\" height=\"145\" /&gt;\r\n\r\nBom, n\u00E3o precisa nem pensar pra saber quanto que esse c\u00F3digo hexadecimal vale em bin\u00E1rio, \u00E9 s\u00F3 bater o olho na tabela, mas de qualquer forma, vamos l\u00E1:\r\n\r\n&lt;a href=\"http://tableless.com.br/wp-content/uploads/2015/06/hexa-binario.jpg\"&gt;&lt;img class=\" wp-image-49692 size-full aligncenter\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/hexa-binario.jpg\" alt=\"\" width=\"505\" height=\"209\" /&gt;&lt;/a&gt;\r\n\r\nN\u00F3s j\u00E1 aprendemos a converter do sistema bin\u00E1rio para o decimal, mas de qualquer forma vamos finalizar:\r\n\r\n&lt;img class=\"aligncenter size-full wp-image-49628\" src=\"http://tableless.com.br/wp-content/uploads/2015/06/final.jpg\" alt=\"convers\u00E3o bin\u00E1rio para decimal\" width=\"512\" height=\"192\" /&gt;\r\n\r\nAgora vai l\u00E1 no Photoshop e coloca na paleta de cor o valor 255 em cada canal: R, G e B. O resultado \u00E9 a cor branca, que j\u00E1 sabemos o porqu\u00EA. O hexadecimal \u00E9 o tal do #FFFFFF.\r\n\r\nO \u00FAnico detalhe que temos que prestar aten\u00E7\u00E3o \u00E9 que se pegarmos um valor hexadecimal, como por exemplo o 5, na tabela vemos que em bin\u00E1rio ele vale 101, isso porque apenas 3 bits s\u00E3o necess\u00E1rios para represent\u00E1-lo. Para fazer a convers\u00E3o, cada valor hexadecimal tem que ser representado em 4 bits. No caso do valor hexadecimal 5 \u00E9 s\u00F3 acrescentar um 0 antes de tudo, ent\u00E3o ao inv\u00E9s de deixar 101, deixamos &lt;b&gt;0&lt;/b&gt;101. Sempre preenchemos com zero \u00E0 esquerda e n\u00E3o \u00E0 direita.\r\n\r\nSe est\u00E1 acostumado a escrever seu c\u00F3digo hexadecimal dessa forma no seu CSS: #FFF, n\u00E3o tem problema. Na verdade isso \u00E9 a abrevia\u00E7\u00E3o do tripleto hexadecimal. Quando os valores de cada canal s\u00E3o iguais, podemos abrevi\u00E1-lo.\r\n\r\nPronto! Agora fa\u00E7a um teste voc\u00EA mesmo com as convers\u00F5es. :-)"^^<http://www.w3.org/2001/XMLSchema#string>
<http://tableless.com.br/rumo-ao-hexadecimal/>