Selector y Conversor de Color
Elige cualquier color visualmente y conviértelo al instante entre HEX, RGB, HSL, HSV y CMYK. Verifica las relaciones de contraste WCAG para accesibilidad y extrae colores directamente de imágenes subidas.
Selector de Color
Opacidad
#3B82F5
Formatos de Color
Verificador de Contraste
Relación de contraste
21.00:1
Seleccionar de Imagen
Cómo usar esta herramienta
- Arrastra el círculo en el lienzo de color para elegir matiz, saturación y brillo, o mueve el control deslizante de matiz debajo de él.
- Edita cualquier campo de formato — HEX, RGB, HSL, HSV o CMYK — y todos los demás campos se actualizarán inmediatamente.
- Haz clic en el icono de copiar junto a cualquier formato para copiar ese valor al portapapeles.
- Usa la sección Verificador de Contraste para pegar dos colores y ver la calificación de aprobación/fallo WCAG AA y AAA para texto accesible.
- Sube una imagen en la sección 'Seleccionar de imagen', luego haz clic en cualquier píxel para extraer su color en todos los campos de formato.
¿Por qué usar nuestro Selector y Conversor de Color?
Ya sea que estés construyendo un sistema de diseño, verificando el cumplimiento de accesibilidad o haciendo coincidir colores de marca en código, necesitas una herramienta de colores rápida y precisa. Este conversor funciona completamente en tu navegador — ninguna imagen o dato de color se envía a un servidor.
Preguntas frecuentes
¿Cuál es la diferencia entre HEX, RGB y HSL?
HEX (#3b82f6) es la notación compacta utilizada en CSS y HTML — tres pares de dígitos hexadecimales que codifican los canales rojo, verde y azul. RGB (rgb(59, 130, 246)) hace explícitos esos canales como números decimales del 0 al 255. HSL (hsl(217, 91%, 60%)) describe el mismo color como Matiz (0–360°), Saturación (%) y Luminosidad (%) — un modelo más intuitivo cuando quieres ajustar el brillo o crear armonías de color.
¿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 física. Usa valores CMYK al preparar arte para una imprenta profesional. Ten en cuenta que la conversión de RGB a CMYK que se muestra aquí es una aproximación matemática — la producción de impresión profesional requiere un perfil de color ICC específico para la impresora y el papel de destino.
¿Qué significa WCAG AA y AAA para el contraste?
Las WCAG (Pautas de Accesibilidad para el Contenido Web) definen umbrales de relación de contraste para texto legible. AA requiere una relación de contraste de al menos 4,5:1 para texto normal y 3:1 para texto grande. AAA es el nivel más estricto, requiriendo 7:1 para texto normal y 4,5:1 para texto grande. Pasar AA es el requisito legal en muchas jurisdicciones.
¿Cuál es la diferencia entre HSL y HSV?
Tanto HSL como HSV describen el color en términos de Matiz y Saturación, pero definen el tercer eje de manera diferente. HSL usa Luminosidad — con 100% de luminosidad el color siempre es blanco independientemente del matiz. HSV usa Valor/Brillo — con 100% de valor el color es completamente saturado y brillante, no blanco. HSV se mapea más naturalmente a cómo los pintores piensan en mezclar colores.
¿Por qué los valores CMYK son aproximados?
Los colores de pantalla se definen en el espacio de color sRGB, mientras que CMYK depende del dispositivo — los mismos valores CMYK producen colores impresos diferentes en distintas impresoras, tintas y tipos de papel. La conversión que se muestra aquí usa la fórmula matemática estándar, que proporciona un buen punto de partida pero no coincidirá exactamente con lo que produciría un RIP profesional con un perfil ICC calibrado.
Herramientas relacionadas
Conversor de YAML a JSON
Convierte entre YAML y JSON al instante. Detecta la dirección automáticamente — todo en tu navegador.
Markdown a HTML
Convierte Markdown a HTML al instante. Admite tablas GFM, listas de tareas y bloques de código.
Analizador de Meta Tags SEO
Analiza title tags, meta descriptions, Open Graph, Twitter Cards y vistas previas sociales de cualquier URL pública.
Base64 Encoder / Decoder
Encode and decode Base64 text quickly and easily.
Herramientas visitadas recientemente
JWT Decoder
DeveloperDecode and inspect JWT tokens. Verify HS256 signatures and check token expiry — all in your browser.
Cron Expression Builder
DeveloperBuild, test, and understand cron expressions with a visual builder and next run times.
CSS Gradient Generator
DeveloperCreate linear, radial and conic CSS gradients with a live visual editor. Copy the CSS code instantly.