Conversor de RGB a HSL

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

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

¿Qué es un conversor de RGB a HSL?

Un conversor de RGB a HSL transforma los valores de rojo, verde y azul en tono, saturación y luminosidad. El RGB describe un color como una mezcla de tres canales de luz de 0 a 255, mientras que el HSL lo describe tal como solemos pensar en el color: un ángulo de tono en la rueda cromática (0–360°), un porcentaje de saturación y un porcentaje de luminosidad. El HSL hace que sea intuitivo aclarar, oscurecer o desaturar un color, y por eso los diseñadores lo usan tanto en CSS.

Cómo convertir RGB a HSL

Primero cada canal RGB se divide por 255 para obtener un valor entre 0 y 1. La luminosidad es el promedio entre el mayor y el menor de esos valores. La saturación proviene de qué tan separados están, ajustada por la luminosidad. El tono es el ángulo que apunta hacia el canal dominante en la rueda cromática. Por ejemplo, rgb(79, 70, 229) se convierte en hsl(243, 75%, 59%). Si incluyes un valor alfa entre 0 y 1, se conserva como un valor hsla().

  1. Escribe o pega los valores RGB en el campo RGB (rgb(...), rgba(...) o números simples funcionan).
  2. Lee el código HSL y, al añadir transparencia, el valor HSLA, actualizados mientras 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 necesites.

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

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

Preguntas frecuentes

¿Cómo convierto un color RGB a HSL?

Lleva cada canal RGB al rango de 0 a 1, luego calcula la luminosidad como el punto medio entre el canal más claro y el más oscuro, la saturación a partir de la diferencia entre ellos, y el tono como el ángulo del canal dominante en la rueda cromática. Por ejemplo, rgb(79, 70, 229) se convierte en hsl(243, 75%, 59%). Esta herramienta hace el cálculo automáticamente.

¿Qué formatos RGB acepta?

Puedes pegar rgb(79, 70, 229), rgba(79, 70, 229, 0.5) o simplemente números como 79, 70, 229. Los espacios, las comas y las barras entre los valores funcionan.

¿Convierte RGBA con transparencia a HSL?

Sí. Cuando incluyes un valor alfa entre 0 y 1, el resultado también muestra un valor hsla() en el que el último número es el canal alfa, como hsla(243, 75%, 59%, 0.5).

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

Describen el mismo color de maneras distintas. El RGB mezcla tres canales de luz de 0 a 255, mientras que el HSL usa un ángulo de tono, un porcentaje de saturación y un porcentaje de luminosidad. El HSL suele ser más fácil de ajustar a mano porque cambiar la luminosidad o la saturación mantiene el mismo tono. Los navegadores modernos y el CSS aceptan ambos.