Convertidor HEX a RGB / RGB a HEX
Convierte códigos de color entre HEX y RGB al instante. Soporta alpha (RGBA, HEX de 8 dígitos), sintaxis CSS4 y copia con un clic. La conversión ocurre íntegramente en tu navegador.
Acepta 3, 4, 6 u 8 dígitos hexadecimales, con o sin #. Ejemplos: #F53, #FF5733, #FF573380.
Acepta rgb(), rgba(), sintaxis CSS4 o valores separados por comas.
O introduce los canales individualmente
- Escribe o pega un valor HEX (con o sin #) a la izquierda — la salida RGB se actualiza al escribir.
- O escribe un valor RGB a la derecha (rgb(), rgba(), sintaxis CSS4 o canales separados por comas) — el HEX se actualiza al instante.
- También puedes introducir los canales R, G, B y A individualmente en los campos numéricos.
- Usa los conmutadores de formato para el prefijo #, mayúsculas en HEX, sintaxis CSS4 o salida con alpha siempre incluido.
- Pulsa el botón Copiar junto a cada salida para copiar el valor formateado al portapapeles.
Ejemplos resueltos
-
#FF5733 → rgb(255, 87, 51)
Divide los 6 dígitos hexadecimales en tres pares: FF, 57, 33. Convierte cada par a base 10: FF = 255, 57 = 87, 33 = 51. Resultado: rgb(255, 87, 51).
-
#F53 → #FF5533 → rgb(255, 85, 51)
La forma corta de 3 dígitos duplica cada dígito: F→FF, 5→55, 3→33. El código expandido es #FF5533, equivalente a rgb(255, 85, 51).
-
rgb(64, 128, 192) → #4080C0
Convierte cada canal de base 10 a base 16 (dos dígitos): 64 = 40, 128 = 80, 192 = C0. Concatena: #4080C0.
Referencia HEX ↔ RGB
Colores con nombre habituales y sus equivalentes HEX y RGB.
| Swatch | Color | HEX | RGB |
|---|---|---|---|
| Black | #000000 | rgb(0, 0, 0) | |
| White | #FFFFFF | rgb(255, 255, 255) | |
| Red | #FF0000 | rgb(255, 0, 0) | |
| Green | #008000 | rgb(0, 128, 0) | |
| Blue | #0000FF | rgb(0, 0, 255) | |
| Tomato | #FF6347 | rgb(255, 99, 71) | |
| Coral | #FF7F50 | rgb(255, 127, 80) | |
| Salmon | #FA8072 | rgb(250, 128, 114) | |
| DodgerBlue | #1E90FF | rgb(30, 144, 255) | |
| DeepSkyBlue | #00BFFF | rgb(0, 191, 255) | |
| Gold | #FFD700 | rgb(255, 215, 0) | |
| Orange | #FFA500 | rgb(255, 165, 0) | |
| HotPink | #FF69B4 | rgb(255, 105, 180) | |
| SlateGray | #708090 | rgb(112, 128, 144) | |
| Teal | #008080 | rgb(0, 128, 128) | |
| Indigo | #4B0082 | rgb(75, 0, 130) | |
| Violet | #EE82EE | rgb(238, 130, 238) | |
| LimeGreen | #32CD32 | rgb(50, 205, 50) | |
| Crimson | #DC143C | rgb(220, 20, 60) | |
| Navy | #000080 | rgb(0, 0, 128) |
¿Qué es un código de color HEX?
Un código HEX es la representación hexadecimal de un color en CSS. Cada par de dígitos codifica un canal (rojo, verde, azul) de 0 a 255. Por ejemplo, #FF5733 significa R=255, G=87, B=51. Un 7º y 8º dígitos opcionales (#RRGGBBAA) añaden el canal alpha.
¿Qué es RGB?
RGB significa Rojo, Verde, Azul — un modelo aditivo donde los colores se forman combinando esos tres canales. Cada canal va de 0 a 255. En CSS: rgb(255, 87, 51) o rgba(255, 87, 51, 0.5) con alpha.
¿Cómo convierto HEX a RGB a mano?
Divide los 6 dígitos en tres pares (#FF5733 → FF, 57, 33) y convierte cada uno a base 10: FF = 255, 57 = 87, 33 = 51. Resultado: rgb(255, 87, 51).
¿Cuál es la diferencia entre #FFF y #FFFFFF?
#FFF es la forma corta de 3 dígitos, donde cada dígito se duplica: F→FF. #FFF y #FFFFFF son idénticos (blanco puro). #F53 se expande a #FF5533.
¿Para qué sirve el canal alpha en #RRGGBBAA?
Controla la transparencia. 00 = totalmente transparente, FF = totalmente opaco, 80 ≈ 50 % de transparencia. Por ejemplo, #FF573380 es #FF5733 con ~50 % de opacidad.
¿Es RGBA lo mismo que RGB con opacidad?
Sí. RGBA añade un canal alpha a RGB. rgba(255, 87, 51, 0.5) es el mismo color con 50 % de opacidad. En CSS Color Level 4 también se puede escribir rgb(255 87 51 / 0.5).
¿Se almacenan o envían mis colores a algún sitio?
No. El convertidor funciona enteramente en tu navegador. Las entradas y resultados nunca se envían a un servidor, registran ni comparten.
¿Por qué algunos navegadores rechazan rgb(255 87 51)?
La sintaxis con espacios pertenece a CSS Color Level 4. Los navegadores muy antiguos solo aceptan la forma con comas rgb(255, 87, 51). Usa el conmutador CSS4 para alternar entre formatos.
¿Cuál es el RGB de blanco, negro y rojo puros?
Blanco puro: #FFFFFF = rgb(255, 255, 255). Negro puro: #000000 = rgb(0, 0, 0). Rojo puro: #FF0000 = rgb(255, 0, 0).