Saltar al contenido

Convertir color HEX a HSL

Convierte un color hexadecimal a HSL (matiz, saturación, luminosidad), el formato más intuitivo para ajustar tonos en CSS.

Se procesa en tu dispositivo. Nada se envía a ningún servidor.

HSL

hsl(173, 82%, 24%)

Convierte un color hexadecimal a HSL (matiz, saturación, luminosidad), el formato más intuitivo para crear variantes más claras u oscuras de un mismo color.

Calcula el matiz (ángulo de 0 a 360), la saturación y la luminosidad a partir de los canales RGB, siguiendo el modelo de color HSL estándar.

Casos de uso

  • Crear variantes de un color ajustando solo la luminosidad.
  • Definir un sistema de color en CSS con hsl().
  • Entender la composición de un color de marca.

Cómo funciona

  1. 1

    Escribe el HEX

    Introduce el código hexadecimal, con o sin almohadilla.

  2. 2

    Copia el HSL

    El valor hsl(h, s%, l%) se calcula al instante.

Preguntas frecuentes

¿Por qué usar HSL en vez de HEX?
HSL facilita crear tonos más claros u oscuros de un mismo color cambiando solo el valor de luminosidad, algo difícil de hacer a ojo con HEX.
Colores y diseño