Conversor de RGB para Hex (e de Hex para RGB) — Grátis, Sem Cadastro
Informe um valor RGB ou um código de cor hexadecimal para converter na hora, nos dois sentidos. Funciona tanto de RGB para hex quanto de hex para RGB, pronto para colar no seu CSS ou ferramenta de design — grátis, sem necessidade de cadastro.
Decimal (Base 10)
| R | |
|---|---|
| G | |
| B |
Hexadecimal (Base 16)
| # |
|---|
Como RGB e códigos de cor hexadecimais se relacionam
Uma cor na tela é determinada por quanto se misturam três luzes: vermelha, verde e azul. Expressar a intensidade de cada uma com um número de 0 a 255 dá o formato RGB; reescrever esses mesmos valores em dois dígitos hexadecimais cada e alinhá-los dá o código de cor hexadecimal #RRGGBB. Ou seja, os dois são simplesmente notações diferentes da mesma cor, e esta ferramenta converte de uma para a outra.
Existem duas notações porque servem a trabalhos diferentes. O hexadecimal expressa uma cor em seis caracteres, o que facilita passá-la entre o CSS e as ferramentas de design. O RGB, por outro lado, mostra cada componente como um número visível, o que torna bem mais simples ajustes do tipo «subir um pouco o vermelho». Ambos os formatos são exibidos para que você use aquele que convém à tarefa do momento.
Como usar o conversor de códigos de cor
- Informe o valor que quer converter Coloque os valores R, G e B nos campos decimais, ou um código de cor no campo hexadecimal. A conversão funciona nos dois sentidos.
- Leia o outro formato O valor correspondente aparece conforme você digita, pronto para ser copiado direto no CSS ou numa ferramenta de design.
- Ajuste os valores e experimente cores Subir e baixar os números do lado decimal deixa fácil acompanhar a mudança de cor, de modo que você pode se aproximar do tom que procura.
Dicas para aproveitar melhor
- No CSS você pode especificar cores nos formatos
#RRGGBBergb(R, G, B). - Cada canal — R (vermelho), G (verde), B (azul) — varia de 0 a 255 (00 a FF em hexadecimal).
- Branco é
#FFFFFF(255, 255, 255) e preto é#000000(0, 0, 0). - Ferramentas de design como Figma e Adobe XD suportam ambos os formatos, então você pode copiar o valor diretamente.
- A abreviação
#FFFequivale a#FFFFFF(branco) e é CSS válido.
Quando converter códigos de cor é útil
Passar uma cor do design para o código
Converta uma cor que a sua ferramenta de design mostra em RGB para o formato hexadecimal que o CSS espera, e evite erros de conversão manual.
Reproduzir com fidelidade uma cor de marca
Quando uma cor definida chega até você em apenas um dos formatos, converta-a para o outro e mantenha tudo coerente. Evita que as cores divirjam entre um documento e a web.
Ajustar uma cor aos poucos
Ajustes difíceis de avaliar em hexadecimal ficam intuitivos ao passar para números RGB: servem bem para afinar o brilho ou o matiz.
Investigar a paleta de um site existente
Converta um código de cor colhido nas ferramentas de desenvolvedor e verá a intensidade de cada componente como um número.
Termos dos códigos de cor
- RGB
- Um sistema que expressa a cor pela intensidade das luzes vermelha, verde e azul. Cada uma assume um valor de 0 a 255; as três em 255 dão branco.
- Hexadecimal
- Uma notação que representa números com dezesseis símbolos, de 0 a F. Como cobre de 0 a 255 em exatamente dois dígitos, é usada para os códigos de cor.
- Forma abreviada
- A forma encurtada para três dígitos, como
#FFF. Só pode ser usada quando os dois dígitos de cada componente são o mesmo caractere. - Cor de 24 bits
- Um sistema que atribui oito bits a cada componente. Juntos expressam cerca de 16,77 milhões de cores.
- Canal
- Cada componente individual que compõe uma cor. No RGB, o vermelho, o verde e o azul são um canal cada.
Perguntas frequentes
#FFFFFF e #ffffff são tratados de forma idêntica no CSS. Os códigos hexadecimais não diferenciam maiúsculas de minúsculas.#AABBCC → #ABC). Um valor como #1DA1F2 não pode ser abreviado.
Curiosidade — O mistério das cores: o olho humano e os 16,7 milhões de cores
Estima-se que o olho humano consiga distinguir cerca de 10 milhões de cores (com variação individual). O color RGB de 24 bits (8 bits por canal) pode representar 16.777.216 cores — muito além dos limites da percepção humana.
Cores de marcas famosas em RGB: Twitter Blue #1DA1F2 (29, 161, 242), Google Red #EA4335 (234, 67, 53), LINE Green #00B900 (0, 185, 0). O icônico azul da Tiffany — Tiffany Blue — é próximo a #0ABAB5 e é uma das poucas cores registradas como marca comercial.
Um dado curioso: o CSS possui uma cor chamada rebeccapurple (#663399). Foi proposta pela comunidade CSS como homenagem à Rebecca, filha de 6 anos do autor de especificações CSS Eric Meyer, e oficialmente adotada em 2014. Continua sendo um episódio muito lembrado na comunidade de engenharia.