Converter HEX para HSL
Converta um código de cor HEX em matiz, saturação e luminosidade para criar tons mais claros e mais escuros com facilidade.
Entrada hex
Resultado · HSL
hsl(344, 100%, 62%)
HEX
#FF3D72
RGB
rgb(255, 61, 114)
HSV
hsv(344, 76%, 100%)
CMYK
cmyk(0%, 76%, 55%, 0%)
Como usar: HEX para HSL
- 1
Insira uma cor
Digite um código de cor ou escolha uma cor com o seletor: cada campo aceita o formato que exibe.
- 2
Veja a conversão
O resultado é atualizado instantaneamente enquanto você digita, junto com uma pré-visualização da cor em tempo real.
- 3
Copie o código
Copie o valor de que precisa com um clique e cole-o no seu design, no seu CSS ou nas configurações de impressão.
Cores HEX e HSL
O HEX é a forma como as cores são escritas no CSS e nas ferramentas de design: um # seguido de três pares de dígitos hexadecimais para vermelho, verde e azul. O HSL descreve a mesma cor do jeito que as pessoas pensam nela — o matiz como um ângulo na roda de cores de 0 a 360° e a saturação e a luminosidade em porcentagem.
Converter para HSL é prático quando você precisa de variações de uma cor: mantenha o matiz e mude a luminosidade para obter tons mais claros e mais escuros para estados de hover, fundos e bordas. Os navegadores entendem as duas notações, por exemplo hsl(342, 100%, 62%). Cole um código de três ou seis dígitos, com ou sem o sinal #, e copie o resultado hsl(); RGB, HSV e CMYK também aparecem.
Tudo funciona localmente no seu navegador: suas imagens nunca são enviadas para um servidor.