Convertidor de HEX a RGB
Convierte cualquier código de color hex a RGB. Pega, convierte, copia. Parte de generador de paletas de color con IA.
Respuesta rápida: Hex y RGB son dos notaciones para el mismo color. Un código hex como #4CA3FF representa rojo (4C = 76), verde (A3 = 163) y azul (FF = 255) como pares hexadecimales.
color: rgb(76, 163, 255); color: hsl(211, 100%, 65%); color: oklch(0.7044 0.1591 252.15);
Cómo funciona
Escribe un código hex
Escribe o pega cualquier valor hex de 3 o 6 dígitos.
Mira la conversión
Los valores RGB, HSL y OKLCH aparecen al instante.
Copia el formato que necesitas
Haz clic en cualquier valor para copiarlo.
¿Qué es la conversión de hex a RGB?
Hex y RGB son dos notaciones para el mismo color. Un código hex como #4CA3FF representa rojo (4C = 76), verde (A3 = 163) y azul (FF = 255) como pares hexadecimales. RGB escribe los mismos valores en decimal: rgb(76, 163, 255).
Hex es el estándar en CSS y herramientas de diseño. RGB es común en software de edición de imágenes, desarrollo Android, y APIs que reciben valores de canal. Convertir entre ellos es un cambio de formato, no una transformación de espacio de color. El color se mantiene idéntico.
El CSS moderno también soporta OKLCH, un espacio de color perceptualmente uniforme donde pasos numéricos iguales producen cambios visuales iguales. OKLCH se usa cada vez más en design systems para generar escalas de tonos consistentes.
Verifica un par convertido con el verificador de contraste WCAG antes de publicarlo, o extrae los colores fuente de una imagen con genera una paleta desde una foto. Más allá del sistema gratis, mira colores de estado y exportación DTCG con Pro.
Casos de uso comunes
Traduce una guía de marca
Convierte el hex de un manual de marca en PDF a RGB y HSL para CSS, código e impresión. Lleva el color base al generador de escalas de tonos cuando necesites una rampa completa.
Lleva colores a una herramienta de diseño
Obtén OKLCH para variables de Figma, RGB para Sketch y HSL para hojas de estilo antiguas en un solo paso.
Arma una variable CSS al vuelo
Copia una declaración --token: rgb(...) lista para usar y sáltate la conversión manual.
Iguala un color de captura de pantalla
Toma el hex de tu cuentagotas y obtén cada formato que necesitas sin pasar por varios conversores.
FAQ
Preguntas frecuentes
Cada formato sirve para algo distinto. Hex es compacto y fácil de compartir, RGB te deja ajustar la opacidad con rgba(), y HSL te permite afinar matiz, saturación y luminosidad por separado, útil para construir estados hover y active desde un color base.
OKLCH es un espacio de color perceptualmente uniforme: un mismo cambio numérico de luminosidad produce el mismo cambio percibido. HSL no funciona así, por lo que dos colores HSL con la misma luminosidad pueden verse muy distintos. Usa OKLCH al construir escalas de tonos o interpolar entre colores.
Copia cualquier valor individual con la muestra, o usa la acción de copiar todo para llevarte un bloque de declaraciones CSS con todos los formatos comentados. Pégalo en una propiedad personalizada como --color-brand y referéncialo con var(--color-brand) donde necesites el color.
De hex a RGB es exacta porque ambos describen el mismo triplete sRGB. HSL se redondea a grados y porcentajes enteros. OKLCH se redondea para que sea legible, a cuatro decimales en luminosidad y croma y dos en el tono; al convertirlo de vuelta da el mismo hex, o uno que difiere como máximo en un paso (de 255) por canal.
Un color convertido.
El plugin de Paletta para Figma convierte un color en una escala completa de 50 a 950, la escribe en Figma Variables y te da el CSS correspondiente.