Convertidor de RGB a HSL

Convierte valores RGB a HSL con vista previa en vivo. Herramienta online gratuita para diseño web, creación de paletas y manipulación de color en CSS.

hsl a rgb

¿Cómo convertir RGB a HSL?

La conversión RGB a HSL transforma el espacio cúbico RGB en el espacio cilíndrico HSL. Es útil cuando se desea ajustar independiente el tono, la saturación o la luminosidad.

El proceso calcula los máximos y mínimos de RGB, determina la luminosidad como su promedio y computa el tono y la saturación según la posición del color en el espacio.

¿Por qué convertir de RGB a HSL?

HSL hace la manipulación de color más intuitiva. Permite ajustar brillo (luminosidad), intensidad (saturación) o cambiar el tono sin afectar otras propiedades. Es útil en herramientas de diseño, procesamiento de imágenes y generación de variantes de color.

¿Qué aporta HSL que RGB no?

HSL describe mejor las propiedades del color: el tipo (tono), cuán vibrante es (saturación) y qué tan claro u oscuro (luminosidad). Facilita crear esquemas armónicos y ajustar colores de forma sistemática.

¿La conversión RGB↔HSL es con pérdida?

No. La conversión es reversible y precisa: puedes convertir de RGB a HSL y volver a RGB sin perder información (salvo redondeos numéricos). Ambos modelos representan el mismo conjunto de colores.

¿Cómo ayuda HSL en diseño web?

Permite generar variaciones sistemáticas: versiones más claras/oscuras ajustando la luminosidad, colores más suaves bajando la saturación o complementarios desplazando el tono. CSS moderno soporta HSL, lo que lo hace práctico.

Conversiones RGB a HSL comunes

Color	RGB	HSL	Hex
Negro	(0, 0, 0)	(0°, 0%, 0%)	#000000
Blanco	(255, 255, 255)	(0°, 0%, 100%)	#FFFFFF
Rojo	(255, 0, 0)	(0°, 100%, 50%)	#FF0000
Lima	(0, 255, 0)	(120°, 100%, 50%)	#00FF00
Azul	(0, 0, 255)	(240°, 100%, 50%)	#0000FF
Amarillo	(255, 255, 0)	(60°, 100%, 50%)	#FFFF00
Cian	(0, 255, 255)	(180°, 100%, 50%)	#00FFFF
Magenta	(255, 0, 255)	(300°, 100%, 50%)	#FF00FF
Gris	(128, 128, 128)	(0°, 0%, 50%)	#808080