Conversor de RGB para HEX

O que é a conversão de RGB para hexadecimal

A conversão de RGB para hexadecimal é uma operação directa dentro do espaço de cor sRGB, o modelo aditivo usado em ecrãs de computador, televisores e dispositivos móveis. O formato RGB (Red, Green, Blue) representa uma cor através de três números decimais, cada um entre 0 e 255, que indicam a intensidade de cada canal de luz. O formato hexadecimal, por sua vez, codifica exactamente esses mesmos três valores num único código de seis dígitos hexadecimais, precedido pelo símbolo # – por exemplo, o vermelho puro (255, 0, 0) torna-se #FF0000.

A relação entre os dois formatos é biunívoca e não há perda de informação durante a conversão, porque ambos descrevem o mesmo espaço de cor. Enquanto o olho humano distingue cerca de 10 milhões de cores, o sRGB com 8 bits por canal oferece 256³ = 16.777.216 combinações possíveis. Cada uma dessas combinações pode ser expressa tanto como uma tripla decimal (ex.: 79, 70, 229) como no seu equivalente hexadecimal (#4F46E5). A ferramenta desta página faz essa tradução em tempo real, sem qualquer aproximação ou recorte de gama.

Como funciona a ferramenta de conversão

O utilizador introduz três números decimais no campo de entrada RGB, separados por vírgulas ou espaços – por exemplo, 79, 70, 229. Imediatamente, a ferramenta calcula o código hexadecimal correspondente e exibe-o no campo de saída #4F46E5. Simultaneamente, a amostra de cor é actualizada e todos os outros formatos suportados (HSL, HSV, CMYK, LAB e o selector de cor) reflectem o mesmo valor. Não existe um botão “Converter”: qualquer alteração num campo provoca a actualização instantânea de todos os restantes.

O formato de entrada esperado é rigoroso: três números inteiros, cada um no intervalo fechado de 0 a 255. Se o utilizador introduzir valores fora desse intervalo, uma string mal formatada ou menos de três números, a ferramenta mostra a mensagem de erro: “Introduza RGB como três números 0–255, como 79, 70, 229.” Este comportamento evita ambiguidades e garante que a conversão só ocorre quando os dados são válidos.

O resultado hexadecimal é sempre um código de seis dígitos, mesmo que os pares de dígitos sejam iguais (por exemplo, #AABBCC não é colapsado para #ABC). No entanto, o campo de entrada hexadecimal aceita a notação abreviada de três dígitos (ex.: #abc), expandindo-a internamente para #AABBCC antes de converter para os restantes formatos. Esta flexibilidade cobre os dois usos comuns em CSS e design.

A matemática por detrás da conversão

Cada valor decimal entre 0 e 255 é convertido para dois dígitos hexadecimais. O sistema hexadecimal usa base 16, em que os dígitos vão de 0 a 9 e de A a F (onde A = 10, B = 11,..., F = 15). O processo é o seguinte:

• Divide-se o valor decimal por 16. O quociente inteiro dá o primeiro dígito hexadecimal (o mais significativo). O resto (0 a 15) dá o segundo dígito (o menos significativo).
• Cada dígito é depois representado pelo carácter correspondente em hexadecimal.

Exemplo prático com o valor 79 (canal vermelho de 79, 70, 229):

• 79 ÷ 16 = 4, resto 15. O dígito mais significativo é 4; o resto 15 corresponde a F. Portanto, 79 em decimal é 4F em hexadecimal.
• Para 70: 70 ÷ 16 = 4, resto 6 → 46.
• Para 229: 229 ÷ 16 = 14, resto 5. 14 é E, resto 5 → E5.

Juntando os três pares: 4F46E5. O código completo é #4F46E5.

Este método é reversível: para voltar a RGB, converte-se cada par hexadecimal para decimal (ex.: 4F = 4×16 + 15 = 79). A ferramenta realiza estes cálculos automaticamente, mas compreender a matemática ajuda a depurar erros quando se trabalha com cores manualmente.

Regras e casos extremos a conhecer

A ferramenta foi desenhada para ser intuitiva, mas existem regras específicas que o utilizador deve dominar:

• Intervalo obrigatório: os valores RGB devem estar entre 0 e 255, inclusive. Qualquer número fora deste intervalo (ex.: 300, -5) ou um formato inválido (ex.: 79, 70 ou 79 70 229 0) dispara a mensagem de erro já referida.
• Sem canal alfa: o código hexadecimal gerado tem sempre seis dígitos e não inclui transparência. Para cores com opacidade, seria necessário o formato de oito dígitos (ex.: #4F46E580), mas esta ferramenta não o produz. O campo de entrada hexadecimal, contudo, aceita códigos de oito dígitos se o utilizador os escrever, e a ferramenta converte-os para os outros formatos, ignorando o canal alfa.
• Ausência de colapso automático: ao contrário de alguns editores visuais, a saída nunca usa a notação abreviada. #AABBCC permanece inalterado, mesmo que seja mais compacto. Isto evita confusões com cores que não se podem abreviar.
• Actualização bidireccional: qualquer campo pode ser editado. Se o utilizador alterar o valor hexadecimal, o RGB é recalculado imediatamente, desde que o código seja válido (com # e seis ou três dígitos hexadecimais).
• Processamento local: todos os cálculos ocorrem no navegador do utilizador. Nenhum dado é enviado para servidores, garantindo privacidade e rapidez.

O espaço de cor sRGB e a equivalência total

RGB e hexadecimal partilham o mesmo espaço de cor: o sRGB (standard Red Green Blue). Este espaço foi definido em 1996 pela HP e Microsoft para uniformizar a representação de cor em monitores, impressão e web. Como ambos os formatos especificam coordenadas dentro do sRGB, a conversão entre eles é exacta e não sofre qualquer ajuste de gama.

Isto contrasta com conversões entre espaços de cor diferentes – por exemplo, de sRGB para CMYK. Enquanto que o sRGB é aditivo (soma de luzes), o CMYK é subtrativo (absorção de tinta). Uma conversão RGB ↔ CMYK pode implicar perda de cor ou alteração de tonalidade porque os dois espaços não são idênticos. Já entre RGB e hex não há diferença conceptual: são duas notações para o mesmo conjunto de valores. O motivo pelo qual o hexadecimal é tão usado em CSS e desenvolvimento web prende-se com a sua compactação e legibilidade em linhas de código, mas em termos cromáticos não oferece vantagens nem desvantagens relativamente ao RGB decimal.

A ferramenta respeita esta equivalência e por isso não realiza qualquer correcção de gama, clipping ou interpolação. O utilizador pode verificar a reversibilidade: se introduzir 79, 70, 229, obtém #4F46E5; se depois copiar esse código hex para o campo de entrada respectivo, o RGB volta a ser 79, 70, 229.

Quem beneficia desta ferramenta

Programadores front-end que escrevem CSS recorrem ao hexadecimal para definir cores em propriedades como color e background-color. Quando recebem especificações de design em valores RGB (comuns em Photoshop, GIMP ou ferramentas de prototipagem), precisam de converter rapidamente para hex sem interromper o fluxo de trabalho. A actualização instantânea da ferramenta evita cálculos manuais e reduz erros de digitação.

Designers UI/UX que trabalham com componentes de interfaces gráficas também usam esta conversão ao migrar dados de programas de imagem para ficheiros de estilo. Além disso, o facto de a ferramenta mostrar simultaneamente HSL, HSV e CMYK permite verificar se a cor se comporta bem em diferentes contextos de apresentação – por exemplo, se o contraste é suficiente para acessibilidade.

Estudantes e entusiastas que estão a aprender os fundamentos da cor digital têm aqui um laboratório prático. Ao experimentar com valores extremos (0,0,0 = preto; 255,255,255 = branco) e variações intermédias, percebem como cada canal contribui para a cor final. O formato hexadecimal, por sua vez, ajuda a compreender o sistema de numeração hexadecimal – um conceito importante em computação, memória e endereçamento.

Finalmente, qualquer pessoa que utilize selectores de cor que retornam valores RGB – como as ferramentas de desenvolvimento do navegador (DevTools) – precisa de um método rápido para obter o hex correspondente e inseri-lo no código. A ferramenta cumpre esse papel sem ruído visual ou anúncios.

Perguntas frequentes (FAQ)

Por que é que o código hexadecimal tem sempre seis dígitos, sem canal alfa?

Porque a ferramenta converte apenas os três canais RGB (vermelho, verde, azul). O formato de oito dígitos (#RRGGBBAA) incluiria um quarto canal para transparência, mas esse não está contemplado na entrada RGB. Se o utilizador precisar de hex com alfa, pode escrevê-lo manualmente no campo hexadecimal – a ferramenta aceita-o e actualiza os restantes campos, ignorando o canal alfa.

Posso usar a notação abreviada de três dígitos no campo hexadecimal?

Sim. A ferramenta aceita #abc e expande internamente para #AABBCC. No entanto, a saída no campo hexadecimal será sempre mostrada como seis dígitos, independentemente do formato introduzido.

O que significa o símbolo # antes do código?

Em CSS e em muitos standards de design, o # indica que o próximo conjunto de caracteres é um código de cor hexadecimal. Sem ele, o browser ou a ferramenta poderia interpretar a string como outro tipo de valor. A ferramenta adiciona automaticamente o # na saída e espera-o na entrada.

Por que é que o valor máximo de cada canal RGB é 255 e não 256?

Porque utilizam-se 8 bits (1 byte) para cada canal. Com 8 bits representam-se 2⁸ = 256 valores possíveis, de 0 a 255 (inclusive). O 0 conta como um valor, pelo que o intervalo fechado tem 256 posições.

O que acontece se introduzir letras ou separadores incorrectos no campo RGB?

A ferramenta valida que a entrada contenha exactamente três números decimais separados por vírgulas ou espaços. Se houver letras, símbolos ou mais de três números, surge a mensagem de erro: “Introduza RGB como três números 0–255, como 79, 70, 229.” Nenhum cálculo é realizado até que a entrada esteja correcta.

A conversão é reversível? Se eu meter o hex de volta, obtenho o RGB original?

Sim, desde que o hex seja válido (6 dígitos, com #). Por exemplo, #4F46E5 convertido para RGB retorna 79, 70, 229. Isto acontece porque ambos os formatos representam o mesmo espaço de cor sRGB, sem qualquer perda.