Conversor de RGB para HEX

Resultados

Insira valores r, g, b de 0 a 255 e o conversor retornará a forma hexadecimal #rrggbb que CSS, Figma, Photoshop e todas as ferramentas de design tratam como uma cor. Suporta alfa opcional via #rrggbbaa ou entrada rgba(), e produz a abreviação de 3 dígitos quando os canais colapsam (por exemplo, #ff0066 para #f06 quando aplicável).

Como a conversão funciona

  1. 1

    Insira rgb()

    Valores de 0 a 255 para cada canal. Decimais são arredondados; a ferramenta aceita "rgb(240, 50, 10)" ou "240 50 10".

  2. 2

    Converta cada canal para hex

    Não divida nada, apenas converta o inteiro de 0 a 255 para dois dígitos hexadecimais. 255 = ff, 128 = 80, 0 = 00.

  3. 3

    Concatene

    Prefixe com "#" e junte os pares r, g, b. Opcionalmente, adicione alfa como um par final.

  4. 4

    Colapse se possível

    Se cada par for um dígito duplicado (#ff00cc), você pode usar a abreviação de 3 dígitos (#f0c).

Referência rápida

RGB HEX Nome comum
255, 0, 0 #ff0000 Vermelho
0, 255, 0 #00ff00 Verde limão
0, 0, 255 #0000ff Azul
255, 255, 0 #ffff00 Amarelo
255, 0, 255 #ff00ff Magenta
0, 255, 255 #00ffff Ciano
255, 255, 255 #ffffff Branco
0, 0, 0 #000000 Preto
128, 128, 128 #808080 Cinza médio
255, 165, 0 #ffa500 Laranja

Regras de abreviação

#rgb é a abreviação para #rrggbb onde cada dígito se repete. Então:

  • #f06 = #ff0066
  • #000 = #000000
  • #abc = #aabbcc

Nem todo hex pode ser encurtado. #ff3366 tem pares ff, 33, 66 que são válidos, então poderia ser #f36. #ff3367 tem 67 que não é um par, então permanece como #ff3367.

Alfa

CSS adicionou a sintaxe hexadecimal #rrggbbaa que inclui alfa:

#ff000080   -> vermelho a 50% de opacidade (0x80 / 0xff ≈ 0.5)
#ff0000ff   -> vermelho totalmente opaco (igual a #ff0000)
#ff000000   -> vermelho totalmente transparente

A abreviação de 4 dígitos #rgba também funciona: #f008 é #ff000088.

Suportado em todos os navegadores

Todos os navegadores modernos aceitam:

  • #rgb, 3 dígitos
  • #rgba, 4 dígitos com alfa
  • #rrggbb, 6 dígitos
  • #rrggbbaa, 8 dígitos com alfa
  • rgb(r, g, b), legado
  • rgb(r g b), moderno separado por espaços
  • rgb(r g b / a), com alfa
  • rgba(r, g, b, a), legado com alfa

Por que tantos formatos

A web herdou a notação hex do X Window System nos anos 1990, depois adicionou rgb() para legibilidade, depois adicionou alfa via rgba(), e então o CSS moderno unificou tudo em rgb() com alfa opcional. O hex sobreviveu porque é facilmente copiado de ferramentas de design e codifica em metade dos bytes.

Perguntas frequentes

Não. #FF0000 e #ff0000 são idênticos. O CSS convencionalmente usa minúsculas; algumas ferramentas de design preferem maiúsculas. Escolha um e mantenha a consistência.

Sim. O hex de três dígitos é uma abreviação onde cada dígito é duplicado. #fff se expande para #ffffff, branco puro.

Como um quarto par de canais. #ff000080 é vermelho com alfa 0x80 (≈ 50% de opacidade). Navegadores modernos e ferramentas de design lidam nativamente com hex de 8 dígitos.

Provavelmente a forma de 8 dígitos (com alfa). #ff0000ff é vermelho opaco; #ff000080 é 50% vermelho.

Ambos funcionam. Hex é mais conciso e copia facilmente de ferramentas de design. rgb() é mais legível quando você está editando valores manualmente. Para animações e valores computados, rgb() é mais fácil de manipular.

Ferramentas relacionadas

Ferramenta disponível em outros idiomas