Saltar al contenido
Bai
EspañolEnglishEuskara Empezar →

Herramientas

Conversor de colores

Convierte un color entre HEX, RGB, HSL, OKLCH, LAB, LCH y OKLAB al instante.

Privado por diseño
Escribe un valor de color válido para ver las conversiones
HEX#3b82f6
RGB59, 130, 246
RGB decimal0.2314, 0.5098, 0.9647
HSL217, 91%, 60%
LAB54.5 8.5 -65.5
LCH54.5 66.0 277.5
OKLAB0.64 -0.01 -0.15
OKLCH0.64 0.15 264

Sobre esta herramienta

Este conversor traduce un mismo color a ocho notaciones a la vez: HEX, RGB, RGB decimal, HSL, LAB, LCH, OKLAB y OKLCH. Es útil cuando el manual de marca da un HEX y tu hoja de estilos usa OKLCH, cuando una librería gráfica pide valores entre 0 y 1, o cuando necesitas comparar colores en un espacio perceptual como LAB antes de ajustar una paleta.

Elige en el desplegable «Formato» la notación de partida y escribe el color en «Valor». La tabla «Todos los formatos» se actualiza mientras escribes y cada fila tiene su botón para copiar. También puedes pulsar la muestra de color de la izquierda y elegir el tono con el selector del sistema. Si cambias de formato, el valor actual se reescribe en la nueva notación para que sigas desde ahí.

Todo el cálculo se hace en tu navegador con JavaScript; no se envía nada a ningún servidor. Trabaja en sRGB con iluminante D65 y redondea a 8 bits por canal, así que los colores fuera de gama se recortan al más cercano. No admite transparencia (alfa) ni HEX abreviado de tres cifras: escribe los seis dígitos.

Preguntas frecuentes

¿Qué diferencia hay entre HSL y OKLCH?

Los dos describen el color con luminosidad, saturación o croma y tono, pero OKLCH está diseñado para que la luminosidad percibida sea uniforme. Dos colores con la misma L en OKLCH se ven igual de claros; en HSL no siempre ocurre.

¿Para qué sirve el RGB decimal?

Es el mismo RGB expresado de 0 a 1 en lugar de 0 a 255. Lo piden muchos motores 3D, shaders y librerías de gráficos como Three.js o Unity.

¿Por qué al convertir de ida y vuelta cambia algún decimal?

Cada conversión redondea a 8 bits por canal (0–255). Al pasar por espacios como LAB u OKLCH y volver, puede aparecer una diferencia de una unidad que a simple vista no se nota.

¿Puedo usar los valores directamente en CSS?

Sí: los formatos hex, rgb(), hsl(), lab(), lch(), oklab() y oklch() los entienden los navegadores actuales. Revisa la compatibilidad si tienes que dar soporte a navegadores antiguos.

Herramientas relacionadas