Conversor de HSL a RGB

Convierte valores de color HSL y HSLA a códigos RGB al instante en tu navegador.

Convierte cualquier color HSL o HSLA a un código RGB al instante con este conversor de HSL a RGB online y gratuito. Escribe valores como hsl(243, 75%, 59%) (o simplemente 243, 75%, 59%), o elige un color con la muestra, y obtén al momento el rgb(80, 72, 229) correspondiente. Acepta números simples separados por comas, cadenas hsl() y hsla(), y un canal alfa opcional que se convierte en un valor rgba(): todo se ejecuta en tu navegador, sin nada que instalar.

¿Qué es un conversor de HSL a RGB?

Un conversor de HSL a RGB transforma los valores de matiz, saturación y luminosidad en rojo, verde y azul. El HSL describe un color de la manera en que las personas suelen pensarlo: un ángulo de matiz en la rueda de colores (0–360°), un porcentaje de saturación y un porcentaje de luminosidad. El RGB describe el mismo color como una mezcla de tres canales de luz de 0 a 255, que es el formato que esperan la mayoría de las herramientas gráficas, los lienzos (canvas) y el CSS más antiguo. Convertir de HSL a RGB te permite diseñar con controles intuitivos de matiz y luminosidad y, aun así, entregar los valores de canal exactos que necesita tu código.

Cómo convertir HSL a RGB

El matiz elige un color base en la rueda, la saturación controla cuán vivo es y la luminosidad controla cuán claro u oscuro queda. El conversor asigna el matiz a uno de los seis segmentos de 60°, mezcla los canales usando la croma derivada de la saturación y la luminosidad, y luego desplaza todo para que el resultado quede en el rango de 0 a 255. Por ejemplo, hsl(243, 75%, 59%) se convierte en rgb(80, 72, 229). Si incluyes un valor alfa entre 0 y 1, se conserva como un valor rgba().

  1. Escribe o pega los valores HSL en el campo HSL (hsl(...), hsla(...) o números simples, todos funcionan).
  2. Lee el código RGB y, cuando añadas transparencia, el valor RGBA, actualizados a medida que escribes.
  3. Usa el selector de color si prefieres elegir un color de forma visual.
  4. Haz clic en Copiar para copiar el formato que necesitas.

¿Por qué usar este conversor de HSL a RGB?

  • 100% gratuito, sin anuncios, registro ni límites.
  • Conversión instantánea a medida que escribes.
  • Acepta hsl(), hsla() y números simples separados por comas.
  • Genera rgb() listo para usar, además de rgba() cuando incluyes transparencia.
  • Se ejecuta por completo en tu navegador: tus colores nunca salen de tu dispositivo.

Preguntas frecuentes

¿Cómo convierto un color HSL a RGB?

Usa el matiz para elegir un color base en la rueda, luego deriva la croma a partir de la saturación y la luminosidad, mezcla los canales rojo, verde y azul para ese matiz y desplázalos al rango de 0 a 255. Por ejemplo, hsl(243, 75%, 59%) se convierte en rgb(80, 72, 229). Esta herramienta hace el cálculo automáticamente.

¿Qué formatos HSL acepta?

Puedes pegar hsl(243, 75%, 59%), hsla(243, 75%, 59%, 0.5) o solo números simples como 243, 75%, 59%. Los signos de porcentaje son opcionales, y los espacios, las comas y las barras entre los valores funcionan.

¿Convierte HSLA con transparencia a RGB?

Sí. Cuando incluyes un valor alfa entre 0 y 1, el resultado también muestra un valor rgba() en el que el último número es el canal alfa, como rgba(80, 72, 229, 0.5).

¿Cuál es la diferencia entre HSL y RGB?

Describen el mismo color de formas diferentes. El HSL usa un ángulo de matiz, un porcentaje de saturación y un porcentaje de luminosidad, mientras que el RGB mezcla tres canales de luz de 0 a 255. El HSL suele ser más fácil de ajustar a mano, pero el RGB es lo que usan internamente la mayoría del código de renderizado y los formatos de imagen. Los navegadores modernos y el CSS aceptan ambos.