Conversor de Cores Grátis: HEX, RGB, HSL e CMYK
Este conversor de cores grátis pega uma cor em HEX, RGB, HSL ou CMYK e a retorna em todos os quatro formatos, com uma amostra para verificar, valores CSS prontos para colar e a cor nomeada CSS mais próxima. Cole #1273b5, rgb(18, 115, 181), hsl(204, 82%, 39%) ou 90, 36, 0, 29 e o formato é detectado automaticamente. Serve para designers, desenvolvedores e qualquer pessoa que precise combinar uma cor de marca para impressão.
Color Converter
Generators and Converters
Sobre esta ferramenta
HEX e RGB descrevem a mesma coisa: quanto de luz vermelha, verde e azul uma tela mistura, de 0 a 255 por canal, escrito em hexadecimal ou decimal. HSL descreve a cor do jeito que as pessoas pensam sobre ela, como um matiz na roda de cores, uma saturação e uma luminosidade, o que torna o formato mais fácil para deixar uma cor mais clara, mais escura ou mais neutra em CSS. CMYK é o modelo subtrativo que as impressoras usam: tinta ciano, magenta, amarela e preta em percentuais.
O conversor aceita HEX abreviado (#abc), HEX com ou sem cerquilha, funções CSS rgb() e hsl(), números separados por vírgula ou espaço, e cmyk() ou quatro percentuais. Valores alfa são ignorados. Ele converte através de RGB usando as fórmulas padrão, arredonda HSL para graus e percentuais inteiros, e mostra a cor nomeada CSS mais próxima por distância, o que é útil quando você precisa de um nome legível em um guia de estilos.
A conversão CMYK aqui é do tipo matemático simples, sem um perfil de cor ICC, então ela mostra as proporções de tinta mas não exatamente como uma prensa e papel específicos renderizarão a cor. Para trabalho de marca que vai para impressão, dê ao seu impressor o valor HEX ou RGB e peça uma prova, ou combine com uma amostra Pantone. Cores de tela mais brilhantes do que qualquer tinta, como verde RGB puro, sempre imprimirão mais opacas.
Perguntas frequentes
Como faço para converter HEX para RGB manualmente?
Divida o HEX de seis dígitos em três pares: #1273b5 é 12, 73 e b5. Converta cada par de hexadecimal para decimal: 12 é 18, 73 é 115 e b5 é 181, então a cor é rgb(18, 115, 181). Um HEX de três dígitos como #fa3 duplica cada dígito primeiro: #ffaa33. Indo para o outro lado, converta cada canal para um número hexadecimal de dois dígitos e junte-os.
Por que minha cor CMYK fica diferente quando impressa?
Uma tela mistura luz e uma impressora mistura tinta, e tinta não consegue reproduzir as cores de tela mais brilhantes, especialmente verdes, azuis e laranjas saturados. A matemática aqui fornece as proporções de tinta sem um perfil de cor, então o resultado impresso também depende da prensa, do papel e do perfil que a impressora usa. Peça uma prova impressa para qualquer cor de marca que importe.
Quando devo usar HSL em vez de HEX em CSS?
Use HSL quando você constrói uma paleta a partir de uma cor de marca: mantenha o matiz, depois mude a luminosidade para estados de hover, bordas e fundos, e a saturação para variantes neutras. Os valores permanecem legíveis e relacionados, onde um conjunto de códigos HEX parece aleatório. Todo navegador moderno suporta hsl(), e você pode misturar HSL e HEX livremente em uma folha de estilos.
O conversor lida com transparência?
Ele lê valores HEX de 8 dígitos, rgba() e hsla() mas ignora a parte alfa e converte apenas a cor sólida, porque CMYK e cores nomeadas não têm transparência. Adicione o alfa de volta no seu CSS, por exemplo rgb(18 115 181 / 50%). A amostra sempre mostra a cor sólida.