Conversor de Cores (HEX, RGB, HSL)

Digite uma cor em qualquer formato comum, ou escolha uma, e receba-a em HEX, RGB e HSL ao mesmo tempo. A ferramenta também verifica o quão legível seria um texto branco ou preto sobre essa cor.

HEX
RGB
HSL
Contraste com texto branco
Contraste com texto preto

Roda inteiramente no seu navegador. Nada do que você digita é enviado a um servidor.

Como usar

  1. Digite um valor HEX, RGB ou HSL, ou use o seletor de cor.
  2. Confira a prévia e os valores convertidos.
  3. Clique em Copiar ao lado do formato de que precisa.
  4. Veja as linhas de contraste para escolher entre texto branco e preto.

Formatos aceitos

  • HEX: #3366CC ou a forma curta #36C, com ou sem o #.
  • RGB: rgb(51, 102, 204), ou apenas 51 102 204.
  • HSL: hsl(220, 60%, 50%), com o matiz em graus e a saturação e a luminosidade em porcentagem.

Perguntas frequentes

Qual a diferença entre HEX e RGB?
Os dois descrevem a mesma cor. O RGB escreve as quantidades de vermelho, verde e azul como números de 0 a 255, e o HEX escreve os mesmos três números na base 16.
Por que usar HSL?
O HSL descreve a cor por matiz, saturação e luminosidade, o que é mais fácil de ajustar à mão. Para deixar uma cor mais clara, aumente a luminosidade e mantenha o matiz.
O que significa a razão de contraste?
Ela segue as diretrizes de acessibilidade WCAG. Texto normal precisa de pelo menos 4,5:1 para passar no nível AA, e texto grande precisa de 3:1. A ferramenta mostra o teste de 4,5:1.
Os valores convertidos são exatos?
HEX e RGB são exatos. Os valores HSL são arredondados para números inteiros, então converter de volta pode diferir em uma unidade.

Mais ferramentas