Toolosaurus

Convertidor de Color y Contraste

Convierta colores HEX, RGB, HSL y CMYK con precisión y pruebe el contraste de accesibilidad WCAG.

UtilidadesActualizado: Octubre 2026
Klicken zum Auswählen
HEX
#4F46E5
RGB
rgb(79, 70, 229)
HSL
hsl(243, 75%, 59%)
CMYK
cmyk(66%, 69%, 0%, 10%)

WCAG 2.1 Kontrast-Prüfer

Barrierefreiheit nach offiziellen W3C-Richtlinien

Vordergrund:
Hintergrund:
Beispieltext für Kontrast
Dies ist Fließtext in normaler Schriftgröße (16px / Regular).
6.29:1
Kontrastverhältnis
Normaler Text (< 18pt)
AA BestandenAAA Nicht erfüllt
Großer Text (≥ 18pt / Fett)
AA BestandenAAA Bestanden
UI & Grafische Elemente
AA Bestanden
Paso a paso

Cómo funciona Convertidor de Color y Contraste

Convierta colores HEX, RGB, HSL y CMYK con precisión y pruebe el contraste de accesibilidad WCAG.

1

1. Introducir código de color o usar selector visual

Escribe o pega tu código de color en el campo superior o selecciónalo interactivamente mediante el selector de color. La herramienta admite formatos HEX (3, 6 u 8 dígitos con canal alfa), RGB/RGBA, HSL/HSLA, HSV/HSB, CMYK, CIE-Lab y CIE-LCh.

2

2. Comprobar la detección automática del espacio de color

Nuestro motor de conversión identifica instantáneamente el formato de origen, valida los rangos numéricos y sincroniza todos los modelos cromáticos en la memoria del navegador.

3

3. Analizar transformaciones multiformato y contraste

Visualiza de inmediato las equivalencias calculadas: sintaxis modernas de CSS Color Module 4 (lch, lab, oklch, color(display-p3)), valores CMYK optimizados para impresión y ratios de contraste WCAG.

4

4. Copiar los códigos al portapapeles con un solo clic

Pulsa el botón de copiar junto al formato deseado (CSS, Tailwind CSS, Swift, Android XML o tokens de diseño para Figma) para integrarlo sin errores en tu flujo de trabajo.

Ventajas y Seguridad de Datos

Conversión instantánea entre HEX, RGB, HSL, HSV, CMYK, LAB, LCH y coordenadas XYZ
Soporte completo para especificaciones CSS Color Module 4 (oklch, oklab, display-p3)
Gestión de canales alfa con notación hexadecimal de 8 dígitos (#RRGGBBAA) y opacidad CSS
Cálculos matemáticos de alta precisión calibrados bajo el iluminante estándar CIE D65
Auditoría integrada de contraste y accesibilidad según directrices WCAG 2.1 (niveles AA y AAA)
Copiado directo de fragmentos de código listos para CSS, Tailwind, Swift y Android XML
Cálculo 100% local en la memoria del navegador sin retrasos de red y con privacidad absoluta

Verificado y Desarrollado por el Equipo de Toolosaurus

Tratamiento conforme al RGPD • Máxima privacidad en tu navegador • Servidores en Alemania

Verificado RGPDCentro de datos ISO 27001
Guía práctica y conocimientos

Todo lo que necesitas saber sobre Convertidor de Color y Contraste

Física del color: Mezcla aditiva en pantallas frente a sustractiva en imprenta

La generación de color en dispositivos digitales y en medios impresos obedece a leyes físicas opuestas. Las pantallas de teléfonos, monitores y televisores utilizan la síntesis aditiva basada en los colores primarios rojo, verde y azul (RGB). Al superponer los tres haces luminosos a su máxima intensidad (255, 255, 255), se produce luz blanca pura. Por el contrario, la imprenta profesional se fundamenta en la síntesis sustractiva mediante tintas de cian, magenta, amarillo y negro (CMYK). Las capas de pigmento absorben selectivamente longitudes de onda de la luz ambiental, por lo que acumular tinta oscurece el resultado. Dado que el espacio sRGB de las pantallas abarca una gama cromática más extensa que el papel impreso, una conversión incorrecta genera impresiones apagadas. Nuestro conversor aplica perfiles normalizados para preservar la fidelidad visual entre el diseño en pantalla y el soporte físico.

Modelos cilíndricos: Comprendiendo HSL y HSV/HSB en sistemas de diseño

Aunque los valores RGB son nativos para los procesadores gráficos, resultan poco intuitivos para las personas: es difícil deducir a simple vista que el tono (46, 204, 113) corresponde a un verde esmeralda. Para facilitar la creatividad, se desarrollaron modelos cilíndricos como HSL (Tono, Saturación, Luminosidad) y HSV/HSB (Tono, Saturación, Valor/Brillo). En ambos sistemas, el tono (Hue) se mide en grados de 0° a 360° en un círculo cromático que recorre rojo (0°), amarillo (60°), verde (120°), cian (180°), azul (240°) y magenta (300°). La discrepancia crucial radica en la dimensión vertical: en HSL, el 100% de luminosidad equivale invariablemente al blanco puro, mientras que en HSV el 100% de brillo mantiene el color puro en su máxima viveza sin blanquearlo. Nuestra herramienta muestra ambos modelos simultáneamente para simplificar la creación de paletas armónicas en CSS y Figma.

Espacios perceptuales: CIE-Lab, LCh y la revolución de Oklch en CSS moderno

Los espacios cromáticos clásicos como sRGB y HSL presentan una carencia notable: carecen de uniformidad perceptual. Para el ojo humano, un amarillo puro (rgb(255,255,0)) se percibe con una luminosidad mucho mayor que un azul puro (rgb(0,0,255)), a pesar de que ambos compartan un 50% de luminosidad en HSL. La Comisión Internacional de la Iluminación resolvió esta distorsión mediante los espacios independientes CIE L*a*b* y CIE L*C*h, modelados según la respuesta biológica de los conos retinianos. La especificación web moderna CSS Color Module Level 4 adopta estos avances a través de oklab() y oklch(). Estas funciones garantizan degradados homogéneos sin bandas grises intermedias y variaciones tonales coherentes. Nuestro conversor proporciona todos los parámetros de estos espacios de vanguardia para su integración en proyectos web.

Ingeniería de accesibilidad: Contraste y luminancia según normas WCAG 2.1

La creación de interfaces digitales inclusivas y accesibles es un requisito imprescindible en el diseño de software actual. Las pautas de accesibilidad para el contenido web (WCAG 2.1 / 2.2) estipulan ratios mínimos de contraste entre el texto y el fondo para garantizar la lectura a personas con discapacidades visuales o en condiciones de iluminación desfavorables. El nivel de conformidad AA exige una relación de contraste mínima de 4.5:1 para texto estándar y de 3.0:1 para tipografía grande (a partir de 18pt o 14pt en negrita). El nivel más riguroso, AAA, eleva esta exigencia a 7.0:1. Nuestro conversor calcula en tiempo real la luminancia relativa conforme a normas ISO, evaluando el cumplimiento frente a fondos blancos y negros para garantizar interfaces legibles y conformes a la ley.

FAQ

Preguntas Frecuentes

Herramientas Relacionadas

Herramientas Similares

Ver las 50 herramientas

ZIP Master

Suba varios archivos y descárguelos como un archivo ZIP comprimido.

Abrir

Conversor Inteligente

Convierta unidades (longitud, peso, temp) y tipos de cambio actuales.

Abrir

Generador de Contraseñas Seguras

Crea contraseñas altamente seguras, aleatorias y personalizables al instante en tu navegador.

Abrir

Cifrado de Texto

Cifre y descodifique textos (Base64, SHA256).

Abrir