Conversor hex a RGB
Lea cualquier código hex como números corrientes: #3498db es rojo 52, verde 152 y azul 219, porque cada par de dígitos es un número en base 16, listo para pegar como rgb(52, 152, 219). Gratis en su navegador.
- Gratis
- Funciona en su navegador
- Sin registro
- Sus datos no salen de su equipo
Ejecutar — gratis
Ejemplo resuelto
- Hexadecimal
- #3498db
- Hex en bruto
- #3498db
- Hex de 6
- 3498db
- Resistencia (Ω)
- 52
- G
- 152
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.
¿Qué valores RGB da #3498db?
Da rojo 52, verde 152 y azul 219. Los pares 34, 98 y db se leen como números en base 16, y el resultado se muestra como rgb(52, 152, 219).
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-rgb \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"hex":"#3498db"}'const res = await fetch("https://api.kit.forhosting.com/color/hex-rgb", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"hex": "#3498db"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/color/hex-rgb",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"hex": "#3498db"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/color/hex-rgb", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"hex":"#3498db"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"hex":"#3498db"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/color/hex-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": "#3498db"
}Ejemplo de respuesta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "color.hex_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.
Límites
max_hex_chars | 7 |
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 $0.002 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.
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.