Convertidor HEX a RGB Gratis - Convertidor de Código de Color y Selector
Convierta códigos HEX a RGB, HSL y CMYK al instante. Incluye selector de color visual.
Vista previa de contraste
Aa — Lorem ipsum
Aa — Lorem ipsum
RGB
HSL
CMYK
HEX8 / RGBA
CSS
Convertir HEX a RGB
Esta herramienta lee un código de color HEX y muestra el mismo color en RGB, HSL, CMYK y un valor HEX/RGBA de 8 caracteres, junto con una muestra en vivo, una vista previa de contraste y un valor de brillo percibido. Escribes o pegas un código, o eliges el color de forma visual, y todos los formatos se actualizan juntos.
Cómo funciona la conversión
Un código HEX de 6 caracteres se divide en tres pares de 2 caracteres, cada uno un número hexadecimal de 00 a FF (0 a 255 en decimal) para rojo, verde y azul. En la forma corta de 3 caracteres, cada dígito se duplica primero, así que #E82 se convierte en #EE8822 antes de aplicar la misma división. A partir de ese triplete RGB, el HSL se calcula con el promedio del canal más claro y el más oscuro para la luminosidad, la diferencia entre ellos para la saturación, y el orden de los canales para el tono. El CMYK se calcula como referencia hallando K a partir del mayor de los tres canales y ajustando cian, magenta y amarillo respecto a ese valor. El brillo percibido usa los pesos ITU-R BT.601, R por 299 más G por 587 más B por 114, dividido entre 1000; un resultado por encima de 128 se marca como Claro, por debajo como Oscuro, lo que también decide el color del texto en la vista previa de contraste. Ese mismo campo también reconoce una cadena rgb(r, g, b) escrita directamente en lugar de un código HEX, y cada selección en el selector de color actualiza el campo HEX automáticamente. Si el código no se puede interpretar, la herramienta muestra un mensaje de error justo debajo del campo en lugar de adivinar un color. Cada valor convertido tiene su propio botón de copiar, que se convierte brevemente en una marca de verificación tras hacer clic, de modo que puedes tomar solo la cadena RGB, la cadena CMYK o la línea CSS sin tocar el resto.
Ejemplo práctico
Tomemos #F4A261. Los pares dan R=244, G=162, B=97, es decir RGB(244, 162, 97). El promedio del canal más claro y el más oscuro da 67 % de luminosidad, la diferencia entre ellos 87 % de saturación, y el tono queda en 27 grados, junto todo HSL(27, 87%, 67%). Los mismos valores RGB dan cmyk(0%, 34%, 60%, 4%) en la fórmula CMYK. La forma de 8 caracteres es #F4A261FF, y la línea CSS es color: #F4A261;. El brillo llega a 179 de 255, por encima del umbral de 128, así que la herramienta marca el color como Claro y cambia a texto negro en la vista previa de contraste.
Ejemplo de salida
Input: #F4A261
Output: {
"rgb": "rgb(244, 162, 97)",
"hsl": "hsl(27, 87%, 67%)",
"cmyk": "cmyk(0%, 34%, 60%, 4%)",
"hex8": "#F4A261FF",
"css": "color: #F4A261;"
}