Conversor de HSL a RGB Convierta valores de HSL a RGB con controles deslizantes interactivos y vista previa en vivo.
Conversor de HSL a RGB
Convierta valores de HSL a RGB con controles deslizantes interactivos y vista previa en vivo.
Establecer valores de HSL
Ajusta los controles deslizantes de Matiz (0-360°), Saturación (0-100%) y Luminosidad (0-100%).
Ver salida RGB
Observa cómo se actualizan instantáneamente los valores Rojo, Verde y Azul.
Copiar valores RGB
Copia la función CSS rgb() para usarla en tu proyecto.
What Is Conversor de HSL a RGB?
Un convertidor de HSL a RGB transforma los valores de color de matiz, saturación y luminosidad en valores de canal rojo, verde y azul. Esta conversión es esencial cuando se han diseñado colores utilizando el modelo HSL intuitivo y se necesitan implementar en sistemas que solo aceptan RGB, como algunas API gráficas, sistemas de control de LED o software antiguo. El modelo HSL te permite pensar en color conceptualmente - qué matiz, cuán vivo, cuán brillante - mientras que RGB es el lenguaje nativo de las pantallas digitales. El convertidor cubre esta brecha, tomando tus elecciones de color amigables para humanos y produciendo los valores precisos del canal necesarios para la reproducción digital. Cada canal de salida varía desde 0 hasta 255, dándote los valores exactos necesarios para las funciones CSS rgb(), operaciones de la API Canvas o cualquier sistema de color basado en RGB.
Why Use Conversor de HSL a RGB?
-
Controles de HSL intuitivos para una exploración natural del color
-
Valores precisos de los canales RGB mostrados en un formato grande y legible
-
Vista previa en tiempo real que muestra el resultado exacto del color
-
Cadena rgb() lista para usar en CSS
-
Rápido y gratuito - no se requiere registro ni instalación
Common Use Cases
Programación gráfica
Convierte colores definidos por HSL a RGB para parámetros de color de WebGL, Canvas o motores de juego.
LED y hardware
Obtén valores RGB para controlar tiras de LED RGB, luces inteligentes o dispositivos IoT que requieren entradas R, G, B.
Integración del sistema de color
Conecta tokens de diseño basados en HSL con frameworks o sistemas heredados que solo admiten RGB.
Educación
Entiende cómo las propiedades perceptuales de HSL se relacionan con el modelo de color aditivo RGB.
Technical Guide
El algoritmo de conversión de HSL a RGB calcula el croma C = (1 - |2L - 1|) × S, donde S y L se normalizan a 0-1. Un valor intermedio X = C × (1 - |(H/60) mod 2 - 1|) determina el segundo componente de color más grande. Según el sector del matiz (0-60°, 60-120°, etc.), se asignan valores RGB temporales utilizando C, X y 0. Finalmente, se agrega un desplazamiento de luminosidad m = L - C/2 a todos los canales y los resultados se escalan desde 0-1 hasta 0-255. Los seis sectores del matiz crean transiciones suaves: 0-60° combina rojo con amarillo, 60-120° amarillo con verde, y así sucesivamente alrededor de la rueda. En S=0, todos los canales RGB son iguales a L×255 (gris). En L=0, todos los canales son 0 (negro). En L=1, todos los canales son 255 (blanco). El algoritmo es matemáticamente preciso y determinista - la misma entrada HSL siempre produce la misma salida RGB.
Tips & Best Practices
-
1HSL (0, 100%, 50%) produce RGB (255, 0, 0) - rojo puro
-
2Cualquier valor de HSL con luminosidad del 0% da como resultado RGB (0, 0, 0), independientemente del matiz y la saturación
-
3HSL con saturación del 0% produce valores R, G, B iguales (tonos grises)
-
4Los valores de matiz se envuelven: 361° es lo mismo que 1°
-
5Esta conversión se utiliza internamente en los navegadores para renderizar colores CSS hsl()
Related Tools
Conversor de RGB a HEX
Convierta valores de color RGB a códigos HEX con controles deslizantes y vista previa en vivo.
🎨 Color Tools
Convertidor de HSL a HEX
Convierta valores de color HSL a códigos HEX con controles deslizantes interactivos.
🎨 Color Tools
Conversor de RGB a HSL
Convierta valores de RGB al formato de color HSL con controles deslizantes interactivos.
🎨 Color Tools
Selector de colores
Selector de colores interactivo con salidas HEX, RGB, HSL y CMYK.
🎨 Color Tools
Generador de tonos claros de colores
Genera tonos más claros de cualquier color con un recuento de pasos ajustable.
🎨 Color ToolsFrequently Asked Questions
Q ¿Es exacta la conversión de HSL a RGB?
Q ¿Qué valores RGB produce hsl(120, 100%, 50%)?
Q ¿Por qué existe HSL si las pantallas utilizan RGB?
Q ¿Puedo convertir de RGB a HSL sin pérdida?
About This Tool
Conversor de HSL a RGB is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.