Início›Ferramentas de cor› Conversor de coresNavegador
Converter uma cor entre HEX, RGB e HSL
Mostra uma cor em todas as notações comuns ao mesmo tempo. Não há direção a escolher — pegue ou cole uma cor e leia o formato que precisar.
- HEX
- #2F6FEB
- RGB
- rgb(47, 111, 235)
- HSL
- hsl(220, 82%, 55%)
- Variável CSS
- --brand: #2f6feb;
Predefinições comuns
Cada uma tem sua própria página, explicando de onde vem aquela exigência e o que esperar.
Como usar
- 1Escolha uma cor na amostra, ou cole um valor como #3b82f6.
- 2Leia a notação que precisar — todas aparecem ao mesmo tempo.
- 3Copie a linha de variável CSS se for colocar a cor numa folha de estilos.
Perguntas frequentes
- Por que não há direção para escolher?
- Porque HEX, RGB e HSL são três jeitos de escrever a mesma cor, não três formatos entre os quais se converte. Mostrar todos de uma vez economiza um clique e a dúvida sobre em que sentido você estava indo.
- Quando usar HSL em vez de HEX?
- Quando você está construindo variações. HSL separa matiz, saturação e luminosidade, então um estado hover é a mesma cor com dez pontos a menos de luminosidade — uma edição sobre a qual dá para raciocinar. Em HEX a mesma mudança são três números sem relação aparente.
- HEX e RGB são exatamente equivalentes?
- São, para os valores de oito bits que as duas notações usam: #3b82f6 e rgb(59, 130, 246) são os mesmos 24 bits escritos de outro jeito. HSL é um sistema de coordenadas diferente sobre o mesmo espaço, então um valor convertido pode cair uma fração fora ao ser arredondado de volta.
- O que é um código hexadecimal de três dígitos?
- Uma abreviação: #f00 vira #ff0000 duplicando cada dígito. Só consegue expressar cores cujos pares de canal se repetem, então cobre 4.096 dos 16,7 milhões — serve para um vermelho rápido, não para uma cor de marca.