Conversor de cores: HEX, RGB, HSL, HSV, CMYK
Digite uma cor em qualquer formato, por exemplo #3B82F6, rgb(59, 130, 246), hsl(217, 91%, 60%) ou cmyk(76%, 47%, 0%, 4%). O conversor reconhece o formato e mostra a mesma cor em todas as outras notações.
Como o cálculo é feito
Como o conversor calcula
Todos os formatos descrevem a mesma cor no espaço de cor sRGB, o padrão para telas e para a web. A base é sempre o valor RGB, com três canais de 0 a 255:
- HEX escreve os três canais como números hexadecimais de dois dígitos: 59 → 3B, 130 → 82, 246 → F6, ou seja,
#3B82F6. A forma curta #RGB duplica cada dígito (#FA0 = #FFAA00); um 4º ou 8º dígito indica a opacidade. - HSL (matiz, saturação, luminosidade) e HWB (matiz, proporção de branco e de preto) são calculados com as fórmulas do CSS Color Module Level 4.
- HSV (também chamado HSB) usa o mesmo matiz do HSL; V é o maior dos três canais, S = (máx − mín) ÷ máx.
- CMYK é calculado com a fórmula simples K = 1 − máx(R, G, B), C = (1 − R − K) ÷ (1 − K) e assim por diante.
Exemplo #3B82F6: R = 59/255 = 0,231, G = 0,510, B = 0,965. Maior valor 0,965, menor 0,231. Luminosidade L = (0,965 + 0,231) ÷ 2 = 59,8%, saturação S = (0,965 − 0,231) ÷ (1 − |2 × 0,598 − 1|) = 91,2%, matiz H = 217,2°. Resultado: hsl(217.2, 91.2%, 59.8%).
Por que o CMYK é só uma aproximação
Tintas de impressão se comportam de forma diferente da luz: qual valor CMYK reproduz melhor uma cor de tela depende do papel, do processo de impressão e da carga de tinta. Essas características ficam num perfil de cor ICC. A fórmula usada aqui não conhece nenhum perfil; para o azul puro, por exemplo, ela dá “cmyk(100%, 100%, 0%, 0%)”, que impresso fica bem mais arroxeado. Para material impresso, portanto: use os valores de cor da gráfica ou converta no programa de diagramação com o perfil da gráfica.
Arredondamento
RGB e HEX são inteiros e, portanto, exatos. HSL, HSV e HWB aparecem com uma casa decimal, e o CMYK em porcentagens inteiras. Os valores usam ponto como separador decimal e podem ser colados diretamente no CSS.
Perguntas frequentes
Como converter HEX para RGB?
Cada par de dígitos é um canal em hexadecimal: #3B82F6 → 3B = 3 × 16 + 11 = 59, 82 = 8 × 16 + 2 = 130, F6 = 15 × 16 + 6 = 246. Resultado: rgb(59, 130, 246).
Posso usar os valores CMYK para impressão?
Só como referência aproximada. A conversão é feita sem perfil de cor ICC. O que vale é o perfil da sua gráfica: peça lá os valores CMYK adequados ou converta no programa de diagramação com o perfil de impressão.
Qual é a diferença entre HSL e HSV?
Os dois usam o mesmo matiz. No HSL, 100% de luminosidade é sempre branco e 50% é a cor pura; no HSV, 100% de valor é o tom mais claro da cor, e o branco se obtém com 0% de saturação. Programas de design costumam chamar o HSV de HSB.
Quais notações são reconhecidas?
HEX com 3, 4, 6 ou 8 dígitos (com ou sem #), rgb()/rgba() também em porcentagem, hsl()/hsla() com deg, turn, rad ou grad, hsv()/hsb(), hwb(), cmyk() com porcentagens e três números soltos como RGB. As sintaxes com vírgula e com espaço (CSS Color 4) funcionam.
Fontes e base legal
- CSS Color 4, § 5.2: W3C – CSS Color Module Level 4: RGB hex notation
- CSS Color 4, § 7: W3C – CSS Color Module Level 4: HSL colors
- CSS Color 4, § 8: W3C – CSS Color Module Level 4: HWB colors
Última atualização:
Ferramentas relacionadas
- Gerador de paleta de coresGere cores que combinam a partir de uma cor base: complementar, análoga, triádica, quadrado, complementar dividida ou monocromática, com HEX, RGB e HSL.
- Verificador de contraste pelas WCAG 2.2Verifique o contraste entre cor do texto e do fundo: razão de contraste pelas WCAG 2.2, avaliação AA/AAA para texto normal e grande e elementos de interface.
- Pegar cor de imagem (conta-gotas)Descubra o código de cor de uma imagem: abra a foto, clique no ponto e copie HEX, RGB e HSL, além das cores principais. Sem upload, tudo fica no navegador.
- Calculadora de 1RM (repetição máxima)Estime seu 1RM a partir da carga e das repetições com as fórmulas de Epley e Brzycki, com tabela de %1RM de 1 a 10 repetições. Em kg ou lb.
- Calcule quanta água você precisa por diaQuanta água beber por dia? Ingestão de bebidas e de água total por idade, sexo, gravidez e amamentação, com os valores de referência da EFSA e da DGE alemã.
- Calculadora de calorias gastas no exercícioCalcule as calorias gastas em 30 esportes e atividades a partir do MET, do peso e da duração, segundo o Compendium 2024, com correção pessoal opcional.