Convertir un color hexadecimal a valores RGB de 0 a 255
Obtenga los tres números que esconde un código hex: #4a90e2 se divide en 4a, 90 y e2, que son rojo 74, verde 144 y azul 226. Una abreviatura como #3af se amplía antes a #33aaff. Gratis en su navegador.
- Gratis
- Funciona en su navegador
- Sin registro
- Sus datos no salen de su equipo
Ejecutar — gratis
Ejemplo resuelto
- Hex
- #4a90e2
- Resistencia (Ω)
- 74
- G
- 144
- B
- 226
Un conversor de hex a RGB toma un color escrito como código hexadecimal—tres o seis dígitos, con o sin almohadilla inicial—y lo descompone en los tres canales enteros que toda pantalla, lienzo y sistema de tokens de diseño sigue hablando de forma nativa: rojo, verde y azul, cada uno de cero a doscientos cincuenta y cinco. Pegue #3498db o la forma corta #abc; la herramienta expande la abreviatura cuando hace falta, normaliza a un hex de seis dígitos en minúsculas y devuelve r, g, b más una cadena CSS rgb() lista para pegar y la aritmética de canales paso a paso.
Qué significa un color hex y cómo se obtiene el RGB
Los códigos de color hexadecimales empaquetan tres canales de ocho bits en una cadena compacta que las hojas de estilo, las herramientas de diseño y las guías de marca llevan décadas usando. En la forma de seis dígitos #RRGGBB, los dos primeros caracteres codifican el rojo, los dos del medio el verde y los dos últimos el azul; cada par se interpreta como un entero en base dieciséis de cero (00) a doscientos cincuenta y cinco (FF).
La abreviatura de tres dígitos #RGB es una comodidad de CSS que duplica cada dígito: #abc se convierte en #aabbcc, de modo que un solo nibble sustituye a un byte completo cuando una paleta solo necesita pasos burdos. Este conversor realiza exactamente ese mapeo: quita una almohadilla inicial opcional, rechaza todo lo que no sean tres o seis dígitos hexadecimales, expande la abreviatura si está presente y luego analiza cada par de dos caracteres en base dieciséis.
El resultado son tres enteros que puede alimentar a estilos de relleno de canvas, estilos en línea de React, HTML de correo o un calculador de ratio de contraste sin rederivar el empaquetado de bits usted mismo. Los ejercicios de clase y las entrevistas de programación suelen pedir esta transformación a mano; disponer de una referencia determinista elimina la ambigüedad sobre mayúsculas, presencia de almohadilla y expansión de abreviatura.
Consejos prácticos, límites y búsquedas relacionadas
Prefiera enviar la cadena hex que exportó su herramienta de diseño, incluida la almohadilla si la tiene; ambas formas funcionan y la respuesta siempre normaliza a hex de seis dígitos en minúsculas para que los diffs posteriores se mantengan estables. No pase formas con alfa como #RRGGBBAA o #RGBA—esta página se limita a propósito al empaquetado RGB opaco clásico, y esas longitudes se rechazan para que lo note en lugar de descartar el alfa en silencio.
Los colores CSS con nombre como rebeccapurple quedan fuera de alcance; conviértalos antes con una tabla de colores con nombre o use una herramienta multi-espacio más amplia cuando también necesite HSL, LAB o CMYK. Esta página se dirige a quienes buscan un conversor hex a RGB, #RRGGBB a rojo verde azul o una calculadora gratuita de color hex a RGB en línea; no es un suite completa de gestión del color, ni un extractor de paletas desde imágenes, ni un camino inverso RGB-a-hex.
Prefiera esta capacidad cuando ya tiene un token hex y solo necesita los tres enteros de canal o una cadena css rgb(); si su pipeline debe pasar por HSL o CMYK de impresión, use en su lugar un conversor multi-formato.
Qué puede hacer con ella
Entrega de tokens de diseño a ingenieros
Los diseñadores pegan códigos hex de marca desde Figma o una guía de estilo y reciben enteros r, g, b exactos y una cadena CSS rgb() para tickets de implementación.
Ayudas de estilo en línea y relleno de canvas
Convierta el hex aportado por el usuario desde un selector de color en canales numéricos para CanvasRenderingContext2D, atributos SVG u objetos de estilo del framework.
Preguntas frecuentes
¿Qué formatos hex acepta el conversor de hex a RGB?
Colores hexadecimales de tres dígitos (#RGB) y seis dígitos (#RRGGBB), con o sin # inicial. Las letras pueden ser mayúsculas o minúsculas. No se aceptan formas con alfa ni colores CSS con nombre.
¿Cómo se expande la abreviatura de tres dígitos?
Cada dígito se duplica: #abc se convierte en #aabbcc; luego cada par se interpreta como entero en base 16 de 0 a 255.
¿Qué representan r, g y b?
Intensidades de los canales rojo, verde y azul como enteros de 0 a 255.
¿El conversor de hex a RGB es gratuito?
La herramienta del navegador es gratuita y se ejecuta en local.
¿Cuáles son los valores RGB de #4a90e2?
Rojo 74, verde 144 y azul 226. El código se divide en los pares 4a, 90 y e2, y cada par se lee como un número en base 16 entre 00 y FF.
Herramientas relacionadas
Para desarrolladores — acceso por API
Todo lo de esta página está disponible por programación. Esta sección es para equipos que quieren integrarlo en sus sistemas; el resto puede usar la herramienta de arriba sin más.
Endpoint de API
¿Prefiere automatizarlo? Un POST autenticado crea la tarea; el resultado llega por webhook o enlace firmado. La misma capacidad también se ejecuta aquí en la web, por email y desde Telegram — y pronto también desde nuestra app.
Llámela desde su stack
curl -X POST https://api.kit.forhosting.com/color/hex-to-rgb \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"hex":"#4a90e2"}'const res = await fetch("https://api.kit.forhosting.com/color/hex-to-rgb", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"hex": "#4a90e2"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/hex-to-rgb",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"hex": "#4a90e2"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/hex-to-rgb", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"hex":"#4a90e2"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"hex":"#4a90e2"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/hex-to-rgb", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Ejemplo de solicitud
{
"hex": "#4a90e2"
}Ejemplo de respuesta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.hex_to_rgb",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}La API es asíncrona: la llamada devuelve un task_id al instante y el resultado llega por webhook. El polling está limitado a 1 req/s por tarea.
Precio
Precio publicado — sin tokens ni créditos inventados. Una tarea fallida no se cobra.
Errores
| HTTP | Código | Significado |
|---|---|---|
401 | unauthorized | API key ausente o inválida. |
402 | insufficient_balance | El saldo no cubre el precio de la tarea. |
404 | unknown_type | El tipo de tarea no existe. |
429 | rate_limited | Demasiadas peticiones. Use el webhook en vez de sondear. |
Notas técnicas
Los códigos inválidos—longitud incorrecta, caracteres no hexadecimales, entrada vacía o un prefijo de programación 0x—fallan con un error claro invalid_input en lugar de inventar un color. El camino es un análisis puramente determinista—sin red, sin semillas aleatorias, sin dependencia del reloj de pared—así que el ejecutor gratuito del navegador y la API prepago devuelven el mismo JSON cada vez que lo invoca.
Cómo llamar a la API y qué devuelve
Ejemplos válidos incluyen #3498db, 3498db, #ABC y abc; se recorta el espacio en blanco circundante, las letras pueden ser mayúsculas o minúsculas y la almohadilla es opcional. Envíe un cuerpo JSON con un campo de cadena obligatorio llamado hex—los alias color, value, text, input y code los acepta el mismo solver. En caso de éxito la respuesta devuelve hex como cadena normalizada en minúsculas #rrggbb, hex6 sin la almohadilla, campos enteros r, g y b junto con alias red, green y blue, un array rgb de tres números, una cadena css de la forma rgb(r, g, b), booleanos shorthand y had_hash que describen la forma original, un mensaje breve en inglés y un array steps que muestra cada línea de canal parseInt para depuración o docencia. La validación fallida—campo ausente, cadena vacía tras la almohadilla, longitud distinta de tres o seis, caracteres no hex, espacios dentro del cuerpo, un prefijo de programación 0x o un número desnudo en lugar de una cadena—devuelve invalid_input y nunca se cobra. El precio es un fijo la tarifa publicada por petición exitosa con unidad item y precio marginal unitario cero.
Consejos prácticos, límites y búsquedas relacionadas
Las tareas fallidas que devuelven invalid_input no consumen saldo prepago, lo que mantiene baratos los scripts exploratorios y la validación de formularios mientras los aprendices pegan valores imperfectos del portapapeles. Las solicitudes automatizadas correctas tienen el precio base publicado de $0.002.
Casos de integración
Pruebas unitarias de fixtures de tema y paleta
Genere triples RGB de referencia a partir de fixtures hex para que las pruebas de regresión visual y de ratio de contraste afirmen valores de canal estables.
Preguntas técnicas
¿Qué ocurre con un código hex inválido?
La API devuelve invalid_input con un mensaje que describe el problema (entrada vacía, longitud incorrecta, caracteres no hex, prefijo 0x, etc.). La validación fallida no se cobra.