Selector/Conversor de Colores
Selecciona colores y convierte entre diferentes formatos
Coincidencias alternativas:
Vista previa de la apariencia del texto
The quick brown fox jumps over the lazy dog
color: #6366f1; background-color: #6366f1; border-color: #6366f1;
Acerca de los Formatos de Color
Los colores pueden representarse en muchos formatos diferentes, cada uno con sus casos de uso y ventajas específicas. Esta herramienta soporta la conversión entre los formatos de color más comúnmente utilizados.
Entender los diferentes modelos de color es esencial para el desarrollo web, diseño UI y creación de arte digital.
Formatos de Color Soportados
#RRGGBB
0-255, 0-255, 0-255
0°-360°, 0-100%, 0-100%
0°-360°, 0-100%, 0-100%
0-100%, ×4
16-235, 16-240, 16-240
L*: 0-100, a*/b*: -128 to +127
Detalles de los Formatos de Color
HEX (Hexadecimal)
Los colores HEX usan una notación hexadecimal de 6 dígitos precedida por #. Cada par representa valores de rojo, verde y azul (00-FF). La notación corta (#RGB) se expande a #RRGGBB. También se admite un formato de 8 dígitos (#RRGGBBAA) para transparencia alfa.
Uso: CSS, HTML, diseño web, mayoría de lenguajes de programación
RGB (Rojo, Verde, Azul)
El modelo RGB crea colores combinando luz roja, verde y azul - es un modelo aditivo. Este modelo corresponde directamente a cómo las pantallas emiten luz, haciéndolo el espacio de color nativo para pantallas digitales.
Uso: Pantallas, iluminación LED, CSS, procesamiento de imágenes digitales
HSL (Tono, Saturación, Luminosidad)
HSL representa colores basándose en la percepción humana. El tono es el ángulo en la rueda de colores, la saturación es la intensidad del color, y la luminosidad es el brillo del color. Esto hace que la manipulación del color sea más intuitiva.
Uso: CSS, generación de esquemas de color, selección de color intuitiva
HSV/HSB (Tono, Saturación, Valor)
HSV (también llamado HSB) es similar a HSL pero usa Valor en lugar de Luminosidad. El valor representa el brillo, con 100% siendo el más brillante. Este modelo coincide con cómo los artistas piensan sobre el color, haciéndolo popular en muchas aplicaciones gráficas.
Uso: Photoshop, GIMP, selectores de color en software gráfico
CMYK (Cian, Magenta, Amarillo, Clave/Negro)
CMYK es un modelo sustractivo utilizado para impresión. A diferencia de RGB que añade luz, CMYK resta luz del papel blanco. La 'K' significa Clave (negro), que mejora la calidad de impresión y reduce el uso de tinta.
Uso: Diseño impreso, impresión comercial, empaquetado
YCbCr (Luminancia, Crominancia)
YCbCr separa los componentes de luminancia (Y) y diferencia de color (Cb, Cr). Esta separación permite una compresión de video eficiente porque el ojo humano es más sensible al brillo que al color. Comúnmente utilizado en JPEG, MPEG y estándares de transmisión.
Uso: Compresión JPEG, codificación de video (H.264, HEVC), transmisión de TV
Lab (CIE L*a*b*)
Lab es un espacio de color perceptualmente uniforme diseñado para aproximar la visión humana. L* es la luminosidad, a* es el eje verde-rojo, y b* es el eje azul-amarillo. Una unidad de distancia perceptual aparece aproximadamente igual sin importar el color.
Uso: Ciencia del color, cálculos de diferencia de color (Delta E), gestión de color profesional
Pantone (PMS)
El Sistema de Coincidencia Pantone (PMS) es un sistema propietario de estandarización de colores ampliamente utilizado en impresión, moda y diseño de productos. Cada color tiene un código único que garantiza una reproducción consistente en diferentes materiales y fabricantes.
Uso: Identidad de marca, impresión comercial, diseño de empaques, industria textil
Nota: Estas son representaciones digitales aproximadas. Los colores Pantone reales pueden variar en impresión.
Fundamentos de Teoría del Color
Los colores existen en diferentes 'espacios' optimizados para diferentes propósitos. Los modelos aditivos (RGB) funcionan añadiendo luz, los modelos sustractivos (CMYK) absorbiendo luz. Los modelos perceptuales (Lab) se alinean con la visión humana.
Modelo Aditivo
RGB combina luz roja, verde y azul. Añadir las tres a máxima intensidad crea blanco. Así funcionan las pantallas, proyectores y displays digitales.
Modelo Sustractivo
CMYK absorbe (resta) longitudes de onda de luz del blanco. Combinar todos los colores crea (en teoría) negro. Así funcionan las tintas y pinturas.
Modelo Perceptual
Lab y espacios similares están diseñados alrededor de la percepción humana, haciéndolos ideales para comparación y corrección de color.
Notas sobre Conversión
- RGB ↔ HEX: Conversión sin pérdida, solo cambio de formato
- RGB ↔ HSL/HSV: Sin pérdida dentro de la gama, puede perder precisión
- RGB ↔ CMYK: Puede perder colores fuera de la gama imprimible
- RGB ↔ Lab: Usa iluminante D65, asume espacio de color sRGB
- RGB ↔ YCbCr: Usa estándar BT.601 por defecto
Estándares de Contraste WCAG
Las Pautas de Accesibilidad al Contenido Web (WCAG) definen requisitos mínimos de contraste entre texto y fondo para asegurar que todos los usuarios, incluyendo aquellos con discapacidades visuales, puedan leer el contenido.