Conversor HEX para RGB Grátis - Conversor de Código de Cor e Seletor

Converter HEX para RGB

Esta ferramenta lê um código de cor HEX e mostra a mesma cor em RGB, HSL, CMYK e um valor HEX/RGBA de 8 caracteres, junto com uma amostra ao vivo, uma pré-visualização de contraste e um brilho percebido. Você digita ou cola um código, ou escolhe a cor visualmente, e todos os formatos se atualizam juntos.

Como funciona a conversão

Um código HEX de 6 caracteres divide-se em três pares de 2 caracteres, cada um um número hexadecimal de 00 a FF (0 a 255 em decimal) para vermelho, verde e azul. Na forma curta de 3 caracteres, cada dígito é duplicado primeiro, então #0B7 vira #00BB77 antes da mesma divisão ser aplicada. A partir desse trio RGB, o HSL é calculado pela média do canal mais claro e do mais escuro para a luminosidade, pela diferença entre eles para a saturação, e pela ordem dos canais para o matiz. O CMYK é calculado como referência ao encontrar K a partir do maior dos três canais e ajustar ciano, magenta e amarelo em relação a ele. O brilho percebido usa os pesos ITU-R BT.601, R vezes 299 mais G vezes 587 mais B vezes 114, dividido por 1000; um resultado acima de 128 é marcado como Claro, abaixo como Escuro, o que também decide a cor do texto na pré-visualização de contraste. O mesmo campo também reconhece uma string rgb(r, g, b) digitada diretamente em vez de um código HEX, e cada escolha no seletor de cores atualiza o campo HEX automaticamente. Se o código não puder ser interpretado, a ferramenta mostra uma mensagem de erro logo abaixo do campo em vez de tentar adivinhar uma cor. Cada valor convertido tem seu próprio botão de copiar, que se transforma brevemente em um sinal de confirmação após o clique, permitindo copiar apenas a string RGB, a string CMYK ou a linha CSS sem mexer no resto.

Exemplo prático

Tomemos #06A77D. Os pares dão R=6, G=167, B=125, ou seja, RGB(6, 167, 125). A média do canal mais claro e do mais escuro dá 34% de luminosidade, a diferença entre eles 93% de saturação, e o matiz fica em 164 graus, juntando tudo em HSL(164, 93%, 34%). Os mesmos valores RGB dão cmyk(96%, 0%, 25%, 35%) na fórmula CMYK. A forma de 8 caracteres é #06A77DFF, e a linha CSS é color: #06A77D;. O brilho chega a 114 de 255, abaixo do limite de 128, então a ferramenta marca a cor como Escura e muda para texto branco na pré-visualização de contraste.

Exemplo de saída

Input:  #06A77D

Output: {
  "rgb":  "rgb(6, 167, 125)",
  "hsl":  "hsl(164, 93%, 34%)",
  "cmyk": "cmyk(96%, 0%, 25%, 35%)",
  "hex8": "#06A77DFF",
  "css":  "color: #06A77D;"
}