Un convertidor sencillo de RGB a HEX. Transforma valores RGB al formato hexadecimal al instante.
Última actualización: 23 de septiembre de 2026
Características
-
Controles deslizantes interactivos para canales rojo, verde y azul (0-255)
-
Vista previa en color en vivo muestra tu selección en tiempo real
-
Ingreso numérico directo para un control preciso
-
Copia con un clic para los valores HEX y RGB
-
Interfaz limpia e intuitiva con transiciones suaves
Qué hace
Arrastra los controles deslizantes y observa cómo cambia el color. La herramienta muestra simultáneamente los formatos rgb(r, g, b) y #hexcode. ¿Necesitas un tono concreto? Escribe los valores exactos. Copia cualquiera de los dos formatos con un solo clic.
Perfecto para:
-
Diseñadores web colores de marca coincidentes
-
Desarrolladores escribiendo CSS
-
Artistas digitales encontrar códigos de color exactos
-
Cualquiera que convierta entre formatos de color
Sin instalación. Sin registro. Sólo conversión de color que funciona.
¿Qué es la conversión de RGB a hexadecimal?
La conversión de RGB a hexadecimal convierte tres números rojos, verdes y azules separados en un código de seis caracteres que los navegadores y las herramientas de diseño leen como un solo color.
El modelo RGB expresa el color como valores de tres canales, cada uno de los cuales va de 0 a 255, según la cantidad de luz roja, verde y azul que se combinan en una pantalla.
Un valor hexadecimal empaqueta esos mismos tres números en una cadena compacta, con el prefijo de un símbolo de almohadilla, y esa cadena se puede pegar directamente en HTML (EN) o CSS sin análisis adicional.
Las pautas de la propia marca Slack enumeran su característico color púrpura en ambos sentidos: #4A154B en hexadecimal y 74, 21, 75 en RGB, el emparejamiento exacto que produce un convertidor (pautas de la marca Slack (EN)).
Los dos formatos describen el mismo color. No cambia nada sobre el píxel, solo cómo se escribe el número.
- RGB es el formato nativo para las pantallas, ya que las pantallas se crean a partir de subpíxeles rojos, verdes y azules.
- Hex es el formato abreviado que se ve más comúnmente en HTML y CSS
- Un convertidor simplemente traduce entre los dos, nunca altera el color visible.
Lo que no es: un selector de color, un generador de paleta o una herramienta para identificar el nombre de un color.
Realiza un trabajo: convertir los números que definen un color RGB en su equivalente hexadecimal, y hace ese trabajo de la misma manera siempre.
¿Cómo funciona la fórmula de conversión de RGB a hexadecimal?
Cada canal RGB se convierte por separado: el número decimal se traduce a un par hexadecimal de dos dígitos y los tres pares se unen en una sola cadena.
El hexadecimal es un sistema base16, por lo que en lugar de contar del 0 al 9 como el sistema decimal, cuenta del 0 al F, donde F representa 15.
Cálculo por canal
La conversión de un canal se reduce a un problema de división única: ejecute una vez para el rojo, una vez para el verde y una vez para el azul.
- Dividir el valor decimal entre 16
- El resultado del número entero se convierte en el primer dígito hexadecimal
- El resto se convierte en el segundo dígito hexadecimal
Un valor de 255 se divide en 16 con un resto de 15, dando los dígitos F y F, o FF.
El rango de 0 a 255 que utiliza cada canal se remonta al espacio de color sRGB, estandarizado por IEC como IEC 61966-2-1 en 1999 y que sigue siendo la suposición predeterminada para colores web sin etiquetar.
Combinando los tres pares
Una vez que el rojo, el verde y el azul tienen cada uno su par hexadecimal de dos dígitos, los tres pares se escriben uno tras otro, con un símbolo de almohadilla delante.
El rojo 255, el verde 87 y el azul 51 se convierten en FF, 57, 33, que se combinan en un único valor hexadecimal #FF5733.
Unas pocas cifras permiten comprender mejor la escala de este sistema.
- 0 a 255 valores posibles por canal, 256 en total
- 16,777,216 colores únicos disponibles en los tres canales combinados
- Dos dígitos hexadecimales por canal, seis dígitos en total para un color estándar
- Numeración base16, donde cada dígito va del 0 al F
¿Cómo se convierte RGBA en un código hexadecimal de 8 dígitos?
RGBA agrega un cuarto valor además del rojo, verde y azul: un canal alfa que controla la transparencia.
La conversión de RGBA a hexadecimal funciona de la misma manera que RGB, excepto que se agrega un cuarto par hexadecimal al final para el valor alfa.
El CSS Módulo de color Nivel 4 (EN) del W3C formalizó esta notación de 8 dígitos como Recomendación candidata en julio de 2022, poniéndose al día con lo que los navegadores ya habían comenzado a ofrecer.
El soporte del navegador siguió de cerca: tablas de compatibilidad de caniuse.com (EN) enumeran el soporte en Chrome 62, Firefox 49, Safari 10 y Edge 79, años antes de que la mayoría de los sitios comenzaran a usar el formato.
- #RRGGBB: seis dígitos, completamente opaco por defecto
- #RRGGBBAA: ocho dígitos, el último par establece la opacidad de 00 (totalmente transparente) a FF (totalmente opaco)
Un valor como CC en esa última posición equivale aproximadamente a un 80 por ciento de opacidad, el mismo resultado que obtendría de un valor alfa decimal en CSS (EN).
No todos los proyectos necesitan esto. Si un color nunca cambia de transparencia, el código simple de seis dígitos sigue siendo más simple y un poco más corto de escribir.
Ir en la otra dirección, desde una cadena hexadecimal a valores de canales individuales, es igual de común, y un convertidor hexadecimal a rgb dedicado maneja esas matemáticas inversas sin ninguna división manual.
¿Cuáles son las ventajas y desventajas de los códigos hexadecimales en comparación con los valores RGB?
Los códigos hexadecimales ganan en brevedad y adopción, los valores RGB ganan en editabilidad y la mayoría de los profesionales terminan usando ambos dependiendo de la tarea.
Ventajas del formato hexadecimal:
- Más corto para escribir y pegar en una hoja de estilo
- Un token en lugar de tres números separados por comas
- El estándar de facto para compartir un código de color con otra persona
Desventajas del formato hexadecimal:
- Más difícil de leer de un vistazo, FF5733 no significa obviamente "un naranja cálido" como lo hace rgb(255, 87, 51)
- Editar un solo canal significa volver a calcular toda la cadena a mano
El 2021 Web Almanac (EN) de HTTP Archive encontró que el 75 por ciento de todos los CSS valores de color usan sintaxis hexadecimal, dividida entre códigos de seis dígitos (50 por ciento) y taquigrafía de tres dígitos (25 por ciento).
Los formatos funcionales quedan muy atrás. rgba() quedó en tercer lugar con un 14 por ciento, mientras que rgb() simple redondeó a cero en ese mismo conjunto de datos.
Esa brecha dice menos sobre qué formato es técnicamente mejor y más sobre el hábito: hexadecimal era el formato de color original de CSS, y la mayoría de las guías de estilo y transferencias de diseño todavía lo utilizan por defecto. Los autores recurren a rgba() principalmente cuando necesitan transparencia.
¿Cómo se comparan RGB y Hex con los modelos de color HSL y CMYK?
RGB y hexadecimal describen el mismo modelo de color aditivo basado en pantalla. HSL y CMYK describen el color de manera diferente y ninguno de los dos se convierte a hexadecimal mediante una simple división.
| modelo | Estructura | Medio nativo | Conversión hexadecimal |
|---|---|---|---|
| RGB | Canales rojos, verdes y azules. | Pantallas | Directo, una fórmula |
| HSL | Tono, saturación, luminosidad. | Pantallas | Requiere convertir primero a RGB |
| CMYK | Cian, magenta, amarillo, clave (negro) | Imprimir | Sin fórmula fija, depende del perfil de tinta |
Podría decirse que HSL es más fácil de razonar para los humanos, ya que al arrastrar el control deslizante de tono se gira a través de la rueda de color mientras que la saturación y la luminosidad permanecen fijas.
Para moverse entre los dos modelos aditivos sin hacer los cálculos manualmente, use el convertidor RGB a HSL.
CMYK funciona según un principio sustractivo creado para tinta sobre papel, no para luz en una pantalla, razón por la cual un color que parece idéntico en RGB y hexadecimal puede cambiar una vez que se imprime.
Esa división aditiva versus sustractiva se trata con más detalle en esta comparación RGB versus CMYK (EN).
Los diseñadores que se mueven entre proyectos web e impresos a menudo mantienen en sus archivos un valor hexadecimal y un equivalente CMYK exactamente por esta razón.
¿Qué herramientas de conversión de RGB a hexadecimal funcionan mejor para diseñadores y desarrolladores?
La herramienta adecuada depende de si es necesario convertir el color una vez, constantemente o como parte de un sistema de diseño más amplio.
Herramientas basadas en navegador
Un convertidor independiente basado en web es la opción más rápida para una conversión única, sin instalación, sin cuenta, pega los valores y lea el resultado.
- Bueno para búsquedas rápidas durante una compilación
- No hay software para instalar o actualizar
- Generalmente es gratuito y funciona en cualquier dispositivo con navegador.
Software de diseño
Varias herramientas de diseño manejan la conversión automáticamente, justo dentro del panel donde se elige el color.
- Photoshop: vuelve a calcular hexadecimal en el momento en que se mueven los controles deslizantes RGB
- Figma y Sketch: muestran ambos formatos uno al lado del otro en el panel de relleno
- GIMP: incluye la misma pantalla dual en su cuadro de diálogo de selección de color
Los verificadores de accesibilidad que prueban contraste de color (EN) casi siempre toman hexadecimal como formato de entrada, ya que WCAG Success Criterion 1.4.3 (EN) establece una relación de contraste mínima de 4.5 a 1 para texto normal.
Herramientas para desarrolladores
Chrome y Firefox DevTools muestran el color calculado de cualquier elemento y le permiten alternar entre hexadecimal, RGB y HSL con un solo clic.
Para la conversión automatizada o masiva, pequeñas bibliotecas JavaScript (EN) como chroma.js manejan las matemáticas mediante programación, sin necesidad de una interfaz de usuario.
Ese enfoque escala mejor que las búsquedas manuales una vez que un proyecto tiene cientos de colores definidos como tokens de diseño.
¿Cómo se convierte RGB a hexadecimal manualmente, paso a paso?
La conversión manual no es más que la división por canal mostrada anteriormente, ejecutada tres veces y escrita en orden.
Vale la pena hacerlo al menos una vez a mano. Comprender la aritmética hace que sea más fácil confiar en cada resultado automatizado.
- Paso 1: Escribe los tres valores RGB, por ejemplo 46, 139, 87
- Paso 2: Divide el primer valor (rojo) entre 16, quédate con el número entero y el resto
- Paso 3: Convierte el número entero y el resto en dígitos hexadecimales, usando de la A a la F para del 10 al 15
- Paso 4: Repita los pasos 2 y 3 para el verde, luego para el azul
- Paso 5: Encadena los tres pares de dos dígitos con un símbolo de almohadilla delante
Siguiendo el ejemplo: 46 dividido por 16 es 2 y el resto 14, lo que da el hexágono 2E para el rojo.
139 dividido por 16 es 8 y el resto 11, lo que da el hexágono 8B para el verde. 87 dividido por 16 es 5 y resto 7, lo que da hexágono 57 para el azul.
En conjunto, eso es #2E8B57, un tono comúnmente etiquetado como verde mar.
Las matemáticas nunca cambian, solo los números que las componen, que es exactamente la razón por la que la misma fórmula funciona ya sea en papel o en un guión.
¿Cómo se convierte RGB a hexadecimal usando código?
Tanto JavaScript como Python convierten RGB a hexadecimal utilizando un método de conversión base incorporado, no una biblioteca de colores dedicada.
La sintaxis difiere, pero las matemáticas subyacentes son idénticas a la fórmula manual tratada anteriormente.
| Idioma | Método central | Admite relleno con ceros |
|---|---|---|
| JavaScript | Number.prototype.toString(16) | No, necesita padStart() |
| Python | format() o el hex() incorporado | Sí, con una especificación de formato. |
En JavaScript
El método toString() acepta un argumento de base y al pasar 16 se devuelve la representación hexadecimal de un número.
El problema: toString(16) elimina los ceros iniciales, por lo que 5 se convierte en "5" en lugar de "05", rompiendo una cadena hexadecimal de seis caracteres.
- Convierta cada canal con .toString(16)
- Rellene el resultado con dos caracteres con .padStart(2, "0")
- Concatene los tres pares acolchados con un símbolo de almohadilla delante
padStart() es parte de la especificación ECMAScript 2017, agregada específicamente para resolver este tipo de problema de formato de cadenas de ancho fijo (ECMA International, 2017).
En Python
Python omite el paso de relleno por separado. Su minilenguaje de especificación de formato maneja el ancho y el relleno cero en una expresión.
Escribir f"{value:02x}" convierte un número entero en una cadena hexadecimal en minúsculas de dos caracteres, con relleno de ceros, en una sola línea.
El tipo de presentación 'x' para enteros hexadecimales en minúscula está documentado en la referencia de especificación de formato (EN) de Python.
Recorrer esa expresión en rojo, verde y azul y unir los resultados produce el mismo resultado de seis caracteres que la versión JavaScript, con menos código a su alrededor.
¿Qué errores comunes ocurren durante la conversión de RGB a hexadecimal?
La mayoría de los errores de conversión provienen del formato, no de las matemáticas. La aritmética es lo suficientemente simple como para que los errores ocurran a su alrededor.
Falta el cero inicial: un valor de canal inferior a 16, como 5, 10 o 15, produce un solo dígito hexadecimal en lugar de dos, lo que reduce un código de seis caracteres en cinco.
Entrada fuera de rango: alimentar a un convertidor con un valor superior a 255 o inferior a 0 no siempre arroja un error.
La especificación CSS Módulo de color nivel 4 establece que los valores fuera de rango no se tratan como no válidos. Están sujetos al límite válido más cercano en el momento del valor calculado (W3C).
Esa sujeción es conveniente para los navegadores, pero también significa que un error tipográfico como 355 se convierte silenciosamente en 255 en lugar de levantar una bandera.
- Confusión de mayúsculas y minúsculas: hexadecimal no distingue entre mayúsculas y minúsculas, por lo que #FF5733 y #ff5733 se representan de manera idéntica; mezclar mayúsculas y minúsculas es una elección de estilo, no un error
- Error de taquigrafía: #f0a se expande a #ff00aa, no a #f00a, cada dígito se duplica en lugar de cambiar de posición
- Deriva de copiar y pegar: pegar un triplete RGB en el campo incorrecto de un convertidor intercambia canales sin ningún mensaje de error
La estandarización en un formato en el origen evita la mayor parte de esto.
El sistema de diseño GOV. UK publica ambos formatos uno al lado del otro para cada color, azul primario, por ejemplo, en RGB 29, 112, 184 y #1D70B8, pero indica a los equipos que hagan referencia a la variable nombrada en lugar de volver a escribir el código hexadecimal a mano (Sistema de diseño GOV. UK).
Ese enfoque de fuente única es la razón por la cual los sistemas de diseño rara vez ven la desviación que causan los valores hexadecimales escritos a mano en bases de código más pequeñas.
¿Cuándo no se aplica la conversión de RGB a hexadecimal?
La fórmula es válida para el estándar RGB de 8 bits y su equivalente hexadecimal, pero algunas situaciones reales quedan completamente fuera de ese alcance.
| Escenario | Por qué el formato hexadecimal no es suficiente | Qué usar en su lugar |
|---|---|---|
| Pantallas de amplia gama cromática | El formato hexadecimal presupone el espacio de color sRGB | Display P3 o funciones color() |
| producción de impresión | CMYK es sustractivo, no aditivo | Un valor CMYK con un perfil ICC |
| Colores del sistema con nombre | Valores como "Canvas" no tienen un triplete fijo RGB | La propia palabra clave de color del sistema operativo |
La propia documentación para desarrolladores de Apple describe la pantalla P3 como aproximadamente 25 por ciento más grande que la gama sRGB que asumen el hexadecimal y el estándar RGB (Apple, WWDC).
Un color creado para ese espacio más amplio no puede representarse con precisión mediante un código hexadecimal ordinario de seis dígitos, ya que el hexadecimal no tiene ningún canal para información de gama.
The gap isn't theoretical. El 2021 Web Almanac (EN) de HTTP Archive encontró que el 79 por ciento de los colores de pantalla p3 utilizados en páginas móviles estaban fuera de lo que sRGB y, por extensión, el hexadecimal estándar, pueden representar. Solo alrededor de 100 páginas usaron display-p3, pero las que lo hicieron lo eligieron por colores hexadecimales que no pueden expresar.
La propia guía de diseño de Apple recomienda verificar los colores de la marca tanto en P3 como en sRGB antes del envío, precisamente porque un valor hexadecimal que se ve bien en un espacio puede cambiar en el otro.
La impresión es un caso completamente aparte.
Un código hexadecimal se convierte limpiamente a RGB y viceversa, pero no tiene una ruta confiable a CMYK porcentajes de tinta sin un perfil ICC en el medio, ya que las pantallas mezclan luz y las prensas mezclan tinta.
El sistema y los colores con nombre completan la lista. Palabras clave como "Canvas" o "ButtonFace" se resuelven según lo que defina el tema actual del sistema operativo, por lo que no hay un triplete RGB fijo para convertir en primer lugar.
Preguntas frecuentes: RGB a HEX: conversor de colores
¿Qué es una tripleta hexadecimal?
Un triplete hexadecimal es la cadena de seis caracteres dentro de un código hexadecimal, un par de dos dígitos cada uno para rojo, verde y azul.
El nombre describe el formato, no un color específico, y se aplica a cada valor hexadecimal en uso.
¿Un código hexadecimal simplemente RGB se escribe de manera diferente?
Sí. Un código hexadecimal y su equivalente RGB describen el color idéntico, solo cambia la base numérica.
RGB cuenta en base 10, hexadecimal cuenta en base16. Ningún formato contiene más información de color que el otro.
¿Qué sucede cuando un valor RGB incluye un decimal?
Los convertidores primero redondean el decimal al número entero más cercano, ya que un dígito hexadecimal no puede representar un valor de canal fraccionario.
Un valor como 127.6 se redondea a 128, luego se convierte normalmente y se muestra sin advertencia para el redondeo.
¿Cuándo debería utilizar HSL en lugar de RGB?
HSL funciona mejor mientras aún se está ajustando un color, ya que cambiar la luminosidad o la saturación no requiere volver a calcular tres números de canales separados.
RGB y hexadecimal encajan mejor una vez que un color está finalizado y está listo para almacenarse como un valor fijo.
¿Photoshop, Figma y Browser DevTools calculan hexadecimal de la misma manera?
Sí, las matemáticas subyacentes son idénticas en todas partes. Es una fórmula fija, no algo abierto a la interpretación de una sola herramienta.
Lo que puede diferir es el manejo del perfil de color, que ocasionalmente cambia el resultado mostrado entre archivos estándar y de gama amplia.
¿Por qué a veces un código hexadecimal convertido parece incorrecto?
El valor hexadecimal en sí rara vez es el problema. Un monitor no calibrado o un perfil de color faltante pueden representar el mismo código de forma diferente en dos pantallas.
Verifica la calibración de pantalla antes de asumir que la conversión cometió un error.
¿Se puede convertir cada valor RGB en un código hexadecimal válido?
Cualquier triplete RGB dentro del rango estándar de 0 a 255 por canal se convierte en un código hexadecimal válido, sin excepciones.
La fórmula tiene sin mayúsculas dentro de ese rango, produce un resultado correcto de seis dígitos cada vez.
¿Cuándo necesita una segunda verificación la salida de un convertidor de RGB a HEX?
La salida de un convertidor RGB a HEX necesita una segunda verificación en tres situaciones: un color de origen de amplia gama, un proyecto encuadernado para impresión y un valor extraído directamente de una pantalla no calibrada.
Fuera de esos tres, el resultado de seis dígitos es definitivo y no necesita mayor verificación.
- Color de fuente dentro de sRGB
- El destino es una pantalla, no una prensa
- Calibración de pantalla confirmada
Los colores de gama amplia todavía son raros en CSS, pero son los que tienen más probabilidades de cambiar cuando se los fuerza a ingresar en un código hexadecimal de seis dígitos, por lo que vale la pena verificar primero un color fuente P3.
Estandarizando en hexadecimal cambios de editabilidad por canal para un código más corto y portátil, un intercambio justo una vez que se finaliza un color.
Para un valor destinado a imprimir en lugar de a una pantalla, un convertidor RGB a CMYK maneja la conversión para la cual las matemáticas sRGB no fueron diseñadas.