¿Por qué las guías de estilo de marca usan hex pero cierto código necesita RGB?

El hex es compacto y se convirtió en el estándar de facto en CSS y las herramientas de diseño, pero muchas APIs — fillStyle de HTML5 Canvas en algunas rutas de código, uniforms de WebGL, constructores de color nativos de iOS/Android y algunas librerías de gráficos — toman argumentos numéricos separados de rojo, verde y azul (a menudo 0-255 o normalizados 0-1) en lugar de una cadena hex.

¿Cómo convierto hex a RGB a mano?

Divide los 6 dígitos en tres pares y convierte cada par de base 16 a base 10. #1A73E8: 1A = 26, 73 = 115, E8 = 232, lo que da rgb(26, 115, 232). Cada par se traduce directamente a un canal — no hay redondeo ni aproximación, es una conversión de base exacta.

¿La conversión de hex a RGB pierde precisión alguna vez?

No — hex y RGB(0-255) representan exactamente el mismo espacio de color de 24 bits, solo que en bases numéricas distintas, así que la conversión no tiene pérdidas en ningún sentido. La pérdida de precisión solo entra en juego si luego conviertes más, por ejemplo a un float normalizado 0-1 para un shader, donde el redondeo de coma flotante puede importar a nivel de subpíxel.

¿Cuál es el equivalente RGB de un atajo hex de 3 dígitos?

Primero expande el atajo duplicando cada dígito — #F63 se convierte en #FF6633 — y luego convierte la forma de 6 dígitos normalmente: FF = 255, 66 = 102, 33 = 51, lo que da rgb(255, 102, 51).

Guide

Convertir un color hex de marca a RGB para tu código

Las guías de marca casi siempre entregan hex. Canvas, WebGL, la UI nativa móvil y muchas herramientas de diseño quieren canales RGB en su lugar.

By Buğra SözeriPublished September 25, 2026

Las guías de estilo de marca entregan sus colores casi siempre en hex — #1A73E8, por ejemplo — porque es compacto y es el estándar de facto en las herramientas de diseño y en CSS. Pero mucho código no acepta hex directamente: el código de dibujo de Canvas 2D, los uniforms de shaders WebGL, los constructores de color nativos móviles (UIColor, la clase Color de Android en algunos constructores) y varias librerías de gráficos o visualización de datos esperan tres canales numéricos separados en su lugar. Convertir la muestra hex de la marca a esos números es una conversión de base exacta y sin pérdidas, no una aproximación.

La conversión, paso a paso

Un color hex de 6 dígitos son tres pares de bytes en base 16 (hexadecimal) concatenados: rojo, luego verde, luego azul, cada uno entre 00 y FF (0 a 255 en decimal). Para #1A73E8:

Par hex	Canal	Valor decimal
1A	Rojo	26
73	Verde	115
E8	Azul	232

Lo que da rgb(26, 115, 232). Cada par se convierte de forma independiente — no hay matemática entre canales, así que la conversión es exacta en ambos sentidos y reversible sin error de redondeo, a diferencia de, por ejemplo, convertir RGB a HSL, que implica cálculos de tipo trigonométrico en coma flotante que pueden introducir pequeñas diferencias de redondeo en una ida y vuelta.

Dónde aparecen los números en el código real

Una vez que tienes los tres valores de canal, la sintaxis exacta depende de la plataforma: CSS y la mayoría de las APIs web aceptan rgb(26, 115, 232) directamente; algunas APIs de shaders y gráficos quieren cada canal normalizado a un float 0-1 (divide cada uno entre 255: 0,102, 0,451, 0,910); los frameworks móviles nativos suelen tener su propia firma de constructor (UIColor(red: 26/255, green: 115/255, blue: 232/255, alpha: 1) en iOS, por ejemplo). Los valores de canal en sí no cambian entre estos casos — solo el formato y la normalización que espera la API de destino.

Mantener los colores de marca consistentes entre formatos

El flujo de trabajo más seguro es tratar el valor hex de la guía de marca como la única fuente de verdad y derivar cualquier otra representación (RGB, floats normalizados, HSL para una herramienta de diseño) de manera programática o con un conversor, en lugar de escribir a mano constantes separadas para cada formato que puedan desincronizarse con el tiempo. Si tu código también necesita un valor CMYK listo para imprimir para el mismo color de marca, parte del mismo hex y convierte desde ahí — nunca estimes el CMYK a ojo contra el color en pantalla.

Frequently asked questions

¿Por qué las guías de estilo de marca usan hex pero cierto código necesita RGB?: El hex es compacto y se convirtió en el estándar de facto en CSS y las herramientas de diseño, pero muchas APIs — fillStyle de HTML5 Canvas en algunas rutas de código, uniforms de WebGL, constructores de color nativos de iOS/Android y algunas librerías de gráficos — toman argumentos numéricos separados de rojo, verde y azul (a menudo 0-255 o normalizados 0-1) en lugar de una cadena hex.
¿Cómo convierto hex a RGB a mano?: Divide los 6 dígitos en tres pares y convierte cada par de base 16 a base 10. #1A73E8: 1A = 26, 73 = 115, E8 = 232, lo que da rgb(26, 115, 232). Cada par se traduce directamente a un canal — no hay redondeo ni aproximación, es una conversión de base exacta.
¿La conversión de hex a RGB pierde precisión alguna vez?: No — hex y RGB(0-255) representan exactamente el mismo espacio de color de 24 bits, solo que en bases numéricas distintas, así que la conversión no tiene pérdidas en ningún sentido. La pérdida de precisión solo entra en juego si luego conviertes más, por ejemplo a un float normalizado 0-1 para un shader, donde el redondeo de coma flotante puede importar a nivel de subpíxel.
¿Cuál es el equivalente RGB de un atajo hex de 3 dígitos?: Primero expande el atajo duplicando cada dígito — #F63 se convierte en #FF6633 — y luego convierte la forma de 6 dígitos normalmente: FF = 255, 66 = 102, 33 = 51, lo que da rgb(255, 102, 51).

Sources & references

Authoritative references cited by this piece. Verified by Buğra Sözeri on the dates shown and re-checked at every deploy.

W3C CSS Color Module Level 4 — notación hexadecimal RGB — La correspondencia formal entre los pares de dígitos hex y los valores de canal RGB de 0 a 255(as of 2026-09-25)
MDN — tipo de dato CSS <color> — Referencia de la sintaxis de la función rgb() y los rangos de valores aceptados(as of 2026-09-25)

Published September 25, 2026