Convertidor RGB a hexadecimal

El Convertidor RGB a Hexadecimal convierte instantáneamente valores de color RGB (Rojo, Verde, Azul) en códigos de color hexadecimales utilizados en diseño web, CSS y aplicaciones gráficas. Proporciona salida en múltiples formatos, incluyendo HSL, HSV y CMYK, junto con fragmentos de código CSS, paletas de armonía de colores, verificación de contraste de accesibilidad WCAG y búsqueda de color con nombre más cercano.

Cómo funciona la conversión de RGB a Hex

RGB (Rojo, Verde, Azul) y Hex son dos notaciones diferentes para el mismo modelo de color aditivo utilizado por las pantallas electrónicas. Cada canal de color varía de 0 a 255 en decimal. Para convertir a Hex, cada valor de canal decimal se expresa como un número hexadecimal de dos dígitos (base 16), y los tres pares se combinan con un prefijo #.

La fórmula de conversión

Para cada valor de canal V (0–255):

1. Divide V por 16. El cociente es el primer dígito hexadecimal, el resto es el segundo.
2. Asigna los dígitos 10–15 a las letras A–F.
3. Combina: #RRGGBB

Ejemplo: RGB(255, 165, 0) → 255 = FF, 165 = A5, 0 = 00 → #FFA500 (Naranja)

Formatos de color explicados

HEX (Hexadecimal)

La notación de color más común en el desarrollo web. Un # seguido de 6 dígitos hexadecimales que representan RR, GG, BB. La forma abreviada (#RGB) está disponible cuando cada par tiene dígitos idénticos, ej. #FF0000 → #F00.

HSL (Tono, Saturación, Luminosidad)

Un modelo más intuitivo para los diseñadores. El Tono (Hue) es un ángulo en la rueda de colores (0°–360°), la Saturación es la vivacidad (0–100%) y la Luminosidad varía desde el negro (0%) pasando por el color puro (50%) hasta el blanco (100%). HSL facilita la creación de variaciones de color ajustando un solo parámetro.

HSV / HSB (Tono, Saturación, Valor / Brillo)

Similar al HSL pero define el brillo de manera diferente. Un valor del 100% significa que el color está en su estado más brillante posible para ese tono y saturación. Este modelo se utiliza en muchas aplicaciones de diseño gráfico como Photoshop y Figma.

CMYK (Cian, Magenta, Amarillo, Negro)

Un modelo de color sustractivo utilizado en impresión. Mientras que las pantallas añaden luz (RGB), las impresoras mezclan tintas que absorben la luz (CMYK). La conversión a CMYK es esencial al preparar diseños digitales para impresión física para asegurar la precisión del color.

Tipos de armonía de colores

Las armonías de colores son combinaciones de colores basadas en sus posiciones en el círculo cromático. Esta herramienta genera cuatro tipos:

• Complementario: El color directamente opuesto en la rueda (separado 180°). Crea el máximo contraste e impacto visual.
• Análogo: Colores adyacentes en la rueda (±30°). Crea diseños armoniosos y cómodos que se encuentran comúnmente en la naturaleza.
• Triádico: Tres colores espaciados uniformemente (separados 120°). Ofrece un contraste vibrante manteniendo el equilibrio.
• Complementario dividido: Los dos colores adyacentes al complemento (150° y 210°). Una alternativa más suave al complementario con más variedad.

Accesibilidad de contraste WCAG

Las Pautas de Accesibilidad para el Contenido Web (WCAG) definen relaciones de contraste para garantizar la legibilidad:

Conversiones comunes de RGB a Hex

Preguntas frecuentes

¿Cómo se convierte de RGB a Hex?

Para convertir RGB a Hex, toma cada valor de canal de color (0-255), divídelo por 16 para obtener el cociente y el resto, luego asígnalos a dígitos hexadecimales (0-9, A-F). Combina los tres valores hexadecimales de 2 dígitos con un prefijo #. Por ejemplo, RGB(255, 165, 0) se convierte en #FFA500: 255→FF, 165→A5, 0→00.

¿Cuál es la diferencia entre los códigos de color RGB y Hex?

RGB y Hex representan los mismos colores usando notaciones diferentes. RGB usa tres números decimales (0-255) para los canales Rojo, Verde y Azul, como rgb(255, 0, 0). Hex usa un # seguido de seis dígitos hexadecimales, como #FF0000. Ambos codifican información de color idéntica; Hex es simplemente una representación en base 16 más compacta de los mismos valores RGB.

¿Qué modelo de color utiliza Hex?

Los códigos de color Hex utilizan el modelo de color aditivo RGB (Rojo, Verde, Azul), el mismo modelo utilizado por las pantallas de computadora. Los seis dígitos hexadecimales representan tres pares: los dos primeros para el rojo, los dos del medio para el verde y los dos últimos para el azul. Cada par varía de 00 (intensidad 0) a FF (intensidad máxima 255).

¿Qué es una relación de contraste WCAG?

La relación de contraste WCAG mide la diferencia de luminancia entre dos colores, utilizada para garantizar la legibilidad del texto para personas con discapacidades visuales. La relación varía de 1:1 (sin contraste) a 21:1 (máximo). WCAG 2.0 requiere al menos 4.5:1 para texto normal (nivel AA), 3:1 para texto grande (AA Large) y 7:1 para contraste mejorado (nivel AAA).

¿Cómo se convierte de RGB a HSL?

Para convertir RGB a HSL: normaliza R, G, B a 0-1, encuentra los valores máximo y mínimo, calcula la Luminosidad como (max+min)/2, la Saturación depende de la luminosidad, y el Tono se calcula según qué canal sea dominante (0° para rojo, 120° para verde, 240° para azul) ajustado por la diferencia entre canales.

¿Qué es CMYK y cuándo debo usarlo?

CMYK significa Cian, Magenta, Amarillo y Negro (Key). Es un modelo de color sustractivo utilizado en impresión. Mientras que RGB/Hex se usan para pantallas (mezcla aditiva de luz), CMYK es esencial para el diseño impreso porque las impresoras mezclan tinta en lugar de luz. Convertir RGB a CMYK ayuda a asegurar que tus colores digitales se traduzcan correctamente a materiales impresos.

Recursos adicionales

• Pautas de contraste WCAG 2.1