Pular para o conteúdo
Tecnologia na prática. Conheça o canal
← Todas as ferramentas

Imagens · TECNOFLAVIO

Conversor de cores HEX e RGB

Converta códigos HEX e canais RGB com amostra visual da cor.

Converta um código HEX em valores RGB, ou faça o caminho inverso. A ferramenta mostra uma amostra da cor e um código rgb() para usar em CSS.

HEX para RGB

Aceita 3 ou 6 dígitos, com ou sem #. Exemplos: #ABC e #AABBCC. Use apenas 0–9 e A–F.

RGB para HEX

Preencha os três canais com números inteiros de 0 a 255. Não use porcentagens ou decimais.

Esta ferramenta converte cores sRGB opacas. Não aceita canal alfa, transparência, porcentagens, nomes de cor, HSL ou CMYK. Um campo vazio não é interpretado como zero.

Como usar o conversor de cores

  1. Escolha o formato de entrada. Se você tem um código como #0284C7, preencha HEX. Se tem três números, use os campos Vermelho, Verde e Azul.
  2. Converta. Clique no botão do formulário correspondente ou pressione Enter dentro dele. Os dois formulários são sincronizados depois de uma conversão válida.
  3. Confira os números e a amostra. A amostra ajuda a reconhecer a cor; os códigos escritos permitem conferir o resultado sem depender apenas da aparência.
  4. Copie para o seu editor. Use Selecionar código e depois Ctrl+C no Windows, Command+C no Mac ou a opção Copiar do dispositivo. O botão seleciona o texto; não copia automaticamente.
  5. Ao alterar um valor, converta novamente. O resultado anterior é escondido para evitar copiar uma cor desatualizada. Limpar apaga entradas e resultado.

O que são HEX e RGB?

RGB representa vermelho, verde e azul. Nesta ferramenta, cada canal usa um inteiro de 0 a 255. HEX escreve os mesmos três canais em base hexadecimal: dois dígitos para vermelho, dois para verde e dois para azul, na ordem #RRGGBB. Por exemplo, #FF0000 corresponde a rgb(255, 0, 0).

Como converter um código HEX curto?

Na forma curta, cada dígito é repetido: #ABC se expande para #AABBCC, equivalente a rgb(170, 187, 204). Letras maiúsculas e minúsculas representam os mesmos valores. O resultado aqui é apresentado com seis dígitos e letras maiúsculas.

Por que a cor pode parecer diferente em outra tela?

A conversão numérica não calibra monitores e não garante a mesma aparência em dispositivos diferentes ou na impressão. Para conferir uma identidade visual, registre o código e o espaço de cor do projeto; não escolha apenas pela aparência da amostra nesta página. Esta ferramenta também não avalia contraste ou acessibilidade de uma combinação de texto e fundo.

Referências e outras ferramentas

Revisão documental e testes: 6 de novembro de 2026. O componente processa os códigos localmente no navegador, sem enviá-los ou salvá-los.