Saltar para o conteúdo
QuickToolio
esEspanolenEnglishptPortuguêsfrFrançaisdeDeutschitItaliano

Converter cor HEX para HSL

Converta uma cor hexadecimal para HSL (matiz, saturação, luminosidade), o formato mais intuitivo para ajustar tons em CSS.

É processado no seu dispositivo. Nada é enviado para nenhum servidor.

HSL

hsl(173, 82%, 24%)

Converte uma cor hexadecimal para HSL (matiz, saturação, luminosidade), o formato mais intuitivo para criar variantes mais claras ou mais escuras da mesma cor.

Calcula o matiz (ângulo de 0 a 360), a saturação e a luminosidade a partir dos canais RGB, seguindo o modelo de cor HSL padrão.

Casos de uso

  • Criar variantes de uma cor ajustando apenas a luminosidade.
  • Definir um sistema de cores em CSS com hsl().
  • Entender a composição de uma cor de marca.

Como funciona

  1. 1

    Escreve o HEX

    Insere o código hexadecimal, com ou sem cardinal.

  2. 2

    Copia o HSL

    O valor hsl(h, s%, l%) é calculado instantaneamente.

Perguntas frequentes

Porquê usar HSL em vez de HEX?

O HSL facilita a criação de tons mais claros ou mais escuros da mesma cor alterando apenas o valor de luminosidade, algo difícil de fazer a olho com HEX.

Como se usa o valor HSL em CSS?

Cola-o diretamente em qualquer propriedade de cor: background-color: hsl(210, 80%, 50%); Todos os navegadores modernos suportam-no nativamente, sem necessidade de o converter para HEX.

Ferramentas relacionadas

← Cores e design