Conversor RGB a HSL

RGB
Entrada
R
G
B
HSL
Resultado
H
S%
L%
HEX

Qué es Conversor RGB a HSL

Esta herramienta convierte valores RGB (Rojo 0–255, Verde 0–255, Azul 0–255) a HSL (Tono, Saturación, Luminosidad). HSL es más intuitivo para la manipulación de colores — es mucho más fácil crear versiones más claras u oscuras de un color ajustando la Luminosidad que modificando canales RGB individuales.

Cómo usar

  1. Introduce los valores de Rojo, Verde y Azul (0–255) en los campos RGB.
  2. Los valores HSL y HEX se actualizan al instante.
  3. Haz clic en el botón de copiar junto a HSL para copiar en formato hsl(h, s%, l%).
  4. Cambia entre los 6 conversores usando los enlaces de modo arriba.

Cuándo usarla

Pasa un color de marca de una hoja de estilos antigua a un sistema de diseño en HSL. Introduce rgb(59, 130, 246) y obtienes hsl(217, 91%, 60%). Desde ahí solo bajas la luminosidad al 55% para el estado hover y al 45% para el active, sin alterar el tono.

Preguntas frecuentes

¿Qué es rgb(255, 0, 0) en HSL?

rgb(255, 0, 0) es hsl(0, 100%, 50%) — rojo puro. El tono 0° es rojo, el 100% de saturación significa completamente saturado y el 50% de luminosidad es el tono puro.

¿Qué es rgb(0, 0, 0) en HSL?

rgb(0, 0, 0) es hsl(0, 0%, 0%) — negro. Luminosidad cero es siempre negro.

¿Qué es rgb(255, 255, 255) en HSL?

rgb(255, 255, 255) es hsl(0, 0%, 100%) — blanco. Luminosidad máxima es siempre blanco.

¿Por qué es útil la conversión RGB a HSL?

HSL hace visibles las relaciones de color. Si tienes rgb(59, 130, 246) no puedes ver de un vistazo qué tan azul o brillante es. Pero hsl(217, 91%, 60%) te dice inmediatamente que es un azul (217° en la rueda de colores), altamente saturado (91%) y medianamente claro (60%).

¿Puedo compartir esta herramienta con mis datos precargados?

Sí. La URL se actualiza automáticamente mientras escribes. Copia el enlace desde la barra de direcciones o usa el botón Compartir — quien lo abra verá tus datos ya cargados.

Herramientas relacionadas