Início Conversor de cor

Conversor de cor

#RGB dobra cada dígito e vira #RRGGBB. #ff0000 é rgb(255, 0, 0) e hsl(0, 100%, 50%). A cor fica aqui.

Por que existe

Um desenho e uma folha de estilo escrevem a mesma cor como #ff0000, rgb(255, 0, 0) ou hsl(0, 100%, 50%).

Esticar o #abc curto para seis dígitos e depois arredondar o HSL para inteiros pode mover um canal em 1.

  1. 01Como usar

    Edite HEX, RGB ou HSL e os outros dois campos e a amostra acompanham.

    A amostra pinta esse hex de fundo. Copiar põe as linhas hex, rgb() e hsl() na área de transferência.

    Fechar a aba apaga a cor. Esta página não lê um canal alfa.

  2. 02Como fica

    #ff0000, #00ff00 e #0000ff são hsl(0, 100%, 50%), hsl(120, 100%, 50%) e hsl(240, 100%, 50%), e cada um volta ao mesmo hex.

    #fff é #ffffff, rgb(255, 255, 255), hsl(0, 0%, 100%). #000000 é hsl(0, 0%, 0%).

    Digitado#ff0000

    #ff0000 rgb(255, 0, 0) · hsl(0, 100%, 50%)
    #00ff00 rgb(0, 255, 0) · hsl(120, 100%, 50%)
    #0000ff rgb(0, 0, 255) · hsl(240, 100%, 50%)
    #abc #aabbcc · volta a #a9bacb
  3. 03Vale saber

    A matiz 360 é igual a 0. hsl(360, 100%, 50%) é #ff0000.

    O cinza #808080 tem saturação 0, então a matiz sai 0. Uma luminosidade de 50% volta a 128, 128, 128.

    Um canal fora da faixa, ou um decimal, mostra um erro nesse campo e a última cor não é copiada.

    Esta conversão é sRGB de tela. Ela não produz CMYK de impressão.

Perguntas

Q#f00 é o mesmo que #ff0000?
ASim. Cada dígito é escrito duas vezes e vira #ff0000.
QO HSL de #abc devolve o mesmo hex?
ANão. hsl(210, 25%, 73%) volta como #a9bacb.
QUm hex de 8 dígitos é lido?
ANão. Só #RGB e #RRGGBB são lidos.
QA cor fica salva?
ANão. Fica neste navegador e não é enviada a um servidor.

Como esta página calcula

Esta página troca HEX, RGB e HSL pela mesma cor sRGB. #RRGGBB escreve vermelho, verde e azul com dois dígitos. #ff0000 é rgb(255, 0, 0) e hsl(0, 100%, 50%). #00ff00 é a matiz 120 e #0000ff é a matiz 240. #RGB dobra cada dígito. #abc vira #aabbcc, que é rgb(170, 187, 204) e hsl(210, 25%, 73%).

HSL usa a mesma conversão do CSS, e a tela arredonda matiz, saturação e luminosidade para inteiros. Voltar por esses inteiros pode mover um canal em 1. hsl(210, 25%, 73%) de #abc volta como #a9bacb. #808080 é rgb(128, 128, 128) e hsl(0, 0%, 50%), e retorna a #808080. A matiz 360 é igual a 0, então hsl(360, 100%, 50%) é #ff0000.

Cada canal RGB é um inteiro de 0 a 255. Saturação e luminosidade vão de 0 a 100. Um hex de 8 dígitos e um decimal não são lidos. Um valor fora da faixa mostra um erro nesse campo e a última cor não é copiada. Esta conversão é sRGB de tela e não produz CMYK de impressão. A cor fica neste navegador e não é enviada a um servidor.

  • # cor
  • # hex
  • # rgb
  • # hsl