Sobre esta ferramenta
HEX para HSL interpreta o HEX segundo as mesmas regras de HEX para RGB e calcula matiz, saturação e luminosidade. HSL ajuda a compreender relações entre cores e a ajustar tons mais claros ou escuros do mesmo matiz.
Como utilizar
- Introduza um HEX de 3 ou 6 dígitos, com ou sem #.
- Consulte o HSL e os valores individuais H, S e L.
- Confira a pré-visualização da cor e copie o HSL.
- Clique em Limpar para apagar a entrada ou carregue um exemplo.
Exemplos de utilização
- #ff0000 → hsl(0, 100%, 50%).
- #00ff00 → hsl(120, 100%, 50%); #0000ff → hsl(240, 100%, 50%).
- #808080 → hsl(0, 0%, 50.2%); #ffffff → hsl(0, 0%, 100%).
Como funciona o cálculo
Dividem-se os canais RGB por 255 e calculam-se o máximo max, o mínimo min e a diferença delta. A luminosidade é L = (max + min) / 2. Nas cores cromáticas, S = delta / (1 − |2L − 1|); o matiz depende da posição do maior canal no círculo cromático. Para cinzento, H e S são definidos como 0. Os decimais só são arredondados na apresentação.
Utilizações comuns
- Compreender o matiz e a luminosidade das cores de um design.
- Converter constantes HEX em HSL para facilitar ajustes de cor.
- Verificar valores HSL de cores puras, cinzento, preto e branco.
Privacidade
O processamento das entradas, os cálculos, a geração de CSS e as pré-visualizações decorrem no seu navegador. O conteúdo nunca é enviado para um servidor. Não são usados backend, base de dados, API online ou CDN de terceiros, nem as suas entradas são guardadas automaticamente.
FAQ
Quais são os três componentes HSL?
H é o ângulo do matiz, S é a saturação em percentagem e L é a luminosidade em percentagem.
Porque se mede o matiz em graus?
O matiz é representado num círculo cromático. Uma volta tem 360°, pelo que 0° e 360° indicam a mesma posição.
Porque tem o cinzento H igual a 0?
Quando os três canais RGB são iguais, não existe um matiz específico. Por convenção, a ferramenta usa H = 0 e S = 0%.
Pode haver erros de precisão na conversão?
Os cálculos internos usam números de vírgula flutuante. O resultado é apresentado com um número adequado de casas decimais; esse arredondamento pode causar pequenas diferenças numa conversão inversa.