Conversor de HEX a RGB
Convierte un color HEX a RGB y HSL con vista previa en vivo.
Cómo usar Conversor de HEX a RGB
- Introduce un color hexadecimal como #137256.
- Copia el valor RGB o HSL que necesites.
Acerca de Conversor de HEX a RGB
HEX y RGB son el mismo color escrito de dos formas. RGB da a cada canal (rojo, verde, azul) un valor de 0 a 255; HEX escribe esos mismos números en base 16, dos dígitos por canal. Por eso #137256 y rgb(19, 114, 86) son idénticos: 13 en hexadecimal es 19, 72 es 114, 56 es 86. La forma abreviada #abc es simplemente #aabbcc duplicando cada dígito. Ambos son aditivos: describen luz que emite una pantalla, a diferencia de la tinta CMYK sobre papel, donde añadir pigmento resta luz.
HSL es el que vale la pena entender. Reconstruye el mismo color como matiz (un ángulo en la rueda de color), saturación y luminosidad, así que los números significan algo. ¿Quieres un estado hover? Baja la luminosidad y el matiz se mantiene igual. ¿Construyendo una paleta? Mantén el matiz y varía S y L, o deja que el generador de tonos lo haga por ti. En RGB estarías adivinando tres números acoplados a la vez. Esa es la verdadera razón por la que los diseñadores convierten a HSL.
Pega un código hexadecimal (# opcional, tres o seis dígitos) y obtén HEX, RGB y HSL con una muestra en vivo mientras escribes. También lee rgb() y acepta rgba(), aunque descarta el alfa. Los hexadecimales de ocho dígitos y los colores con nombre no se analizan. Todo se ejecuta en tu navegador. Comprueba la legibilidad con el verificador de contraste.
Preguntas frecuentes
¿Admite hexadecimal de 3 dígitos?
Sí. El hexadecimal corto como #abc se expande a #aabbcc duplicando cada dígito, y el propio # es opcional.
¿Por qué #137256 es lo mismo que rgb(19, 114, 86)?
Porque el hexadecimal es simplemente base 16. Cada par de dígitos hexadecimales es un canal: 13 en hexadecimal es 19 en decimal, 72 es 114, y 56 es 86. El mismo color, distinta notación.
¿Qué es HSL y por qué lo usaría?
Matiz, saturación y luminosidad. Separa qué color es algo de lo vivo y lo claro que es, así que puedes construir un tinte, una sombra o un estado hover ajustando un solo número en lugar de adivinar tres valores RGB nuevos.
¿Puedo introducir un color con transparencia?
Puedes pegar un valor rgba(), pero el alfa se ignora: solo se convierten los canales de color. Los códigos hexadecimales de ocho dígitos con alfa no se aceptan.
¿Se admiten colores con nombre como tomato o rebeccapurple?
No. Esta herramienta solo lee hexadecimal de tres o seis dígitos y valores rgb() o rgba().