Conversor de cores: HEX, RGB, HSL, HSV, HWB, CMYK, LAB e OKLCH
Converta qualquer cor entre HEX, RGB, HSL, HSV, HWB, CMYK, CIELAB e OKLCH, veja o nome CSS e o contraste WCAG sobre branco e preto. Grátis, no seu navegador.
Aceita HEX (#rgb, #rrggbb, #rrggbbaa), rgb()/rgba(), hsl()/hsla(), hsv(), hwb(), cmyk(), lab(), oklch() e os 148 nomes de cor CSS.
dodgerblue#1e90ffrgb(30, 144, 255)hsl(209.6, 100%, 55.9%)hsv(209.6, 88.2%, 100%)hwb(209.6 11.8% 0%)cmyk(88.2%, 43.5%, 0%, 0%)lab(58.36% 0.89 -64.78)oklch(65.2% 0.1901 253.21)O CIELAB usa o ponto branco D50 como no CSS Color 4. Os valores só são arredondados na exibição; as conversões usam precisão total. A transparência é ignorada em CMYK, HSV e contraste.
O que é Conversor de cores?
Cole uma cor em qualquer notação comum e obtenha-a em oito modelos de cor de uma vez: HEX, RGB(A), HSL(A), HSV, HWB, CMYK, CIELAB e OKLCH. A ferramenta também mostra o nome de cor CSS correspondente (se houver um exato) e a razão de contraste WCAG da cor sobre branco e sobre preto.
Como usar Conversor de cores
- Digite ou cole uma cor em Cor (qualquer formato), por exemplo
#1e90ff,rgb(30 144 255),hsl(210 100% 56%),oklch(65% 0.19 253)outomato, ou escolha uma no seletor de cores. - Leia os valores convertidos na lista de resultados; cada linha tem o próprio botão Copiar.
- Confira o Nome CSS para uma correspondência exata com uma cor nomeada e os cards de contraste sobre branco / preto para os resultados WCAG AA e AAA.
- Se um valor LAB ou OKLCH estiver fora do sRGB, um aviso informa que ele foi ajustado para a cor exibível mais próxima.
Exemplo
#ff0000
rgb(255, 0, 0) · hsl(0, 100%, 50%) · hsv(0, 100%, 100%) · hwb(0 0% 0%) · cmyk(0%, 100%, 100%, 0%) · lab(54.29% 80.8 69.89) · oklch(62.8% 0.2577 29.23) · CSS name: red
O contraste sobre branco é 3,99:1, então o vermelho puro reprova no WCAG AA para texto normal.
Quando usar Conversor de cores
Use-o ao levar cores entre ferramentas de design e CSS, quando precisar de um modelo perceptual como o OKLCH para montar paletas ou para conferir rapidamente o contraste de texto. Não use a saída CMYK para provas de impressão profissionais: a impressão real precisa de um perfil de cor ICC, que esta fórmula simples ignora.
Como funciona Conversor de cores
Toda entrada é convertida em canais sRGB com codificação gama mais alfa. HSL, HSV e HWB são as transformações cilíndricas padrão do sRGB; o CMYK usa a fórmula simples independente de dispositivo K = 1 − max(R,G,B). Para LAB, os valores sRGB são linearizados, convertidos para CIE XYZ (D65), adaptados cromaticamente para D50 com a matriz de Bradford e transformados em CIELAB, exatamente como no CSS Color 4. O OKLCH usa as matrizes OKLab de Björn Ottosson sobre o sRGB linear. Os valores só são arredondados na exibição (inteiros para RGB, uma casa decimal para HSL/HSV/HWB/CMYK, duas para LAB). O contraste segue a luminância relativa do WCAG 2.x: (L1 + 0,05) / (L2 + 0,05).
Casos de Uso Comuns
- Transformar o código HEX de uma marca, tirado de um guia de estilo, em
hsl()ouoklch()para variáveis CSS - Converter um valor
rgba()do DevTools em um HEX de 8 dígitos com alfa - Conferir se a cor de um texto passa no WCAG AA (4,5:1) sobre fundo branco
- Descobrir a palavra-chave CSS de um valor HEX como
#663399(rebeccapurple) - Obter porcentagens CMYK aproximadas para uma impressão de escritório
Perguntas Frequentes
Por que o valor LAB é diferente do Photoshop?
Esta ferramenta segue o CSS Color 4, que usa o ponto branco D50 com adaptação de Bradford. Alguns apps mostram o LAB relativo ao D65, o que dá números um pouco diferentes.
O que significa “fora da gama sRGB”?
LAB e OKLCH conseguem descrever cores que uma tela sRGB comum não exibe. Essas entradas são ajustadas canal a canal para a cor exibível mais próxima, e o aviso informa que os valores HEX/RGB são aproximações.
Como a razão de contraste é arredondada?
Ela é truncada, e não arredondada para cima, em duas casas decimais, para que uma razão de 4,499 nunca apareça como aprovada em 4,5:1.
O alfa é mantido em todos os formatos?
O alfa é mantido em HEX (8 dígitos), rgba(), hsla(), HWB, LAB e OKLCH. HSV e CMYK não têm canal alfa, e o contraste é calculado para a cor opaca.