Sobre esta herramienta
Verificador de contraste de color WCAG AA/AAA.
Las Pautas de Accesibilidad al Contenido Web (WCAG) exigen ratios de contraste mínimos entre el texto y los colores de fondo para garantizar la legibilidad a personas con baja visión. El Verificador de Contraste calcula el ratio de contraste entre un color de primer plano y de fondo y muestra si supera el Nivel AA de WCAG 2.1 (4,5:1 para texto normal, 3:1 para texto grande) y el Nivel AAA (7:1).
Ejemplo
Texto #333333 sobre fondo #ffffff → Relación: 12,63:1 · WCAG AA: ✓ Pasa · WCAG AAA: ✓ Pasa
Cómo usar
- Introduce el color del texto (primer plano) en HEX o usa el selector de color.
- Introduce el color de fondo.
- El ratio de contraste aparece al instante.
- Las marcas de verificación muestran si AA/AAA pasa o falla.
Características
- Ratio de contraste (fórmula WCAG 2.1)
- Indicadores de pasa/falla AA y AAA
- Umbrales de texto normal y grande
- Entrada de color HEX y RGB
- Muestra de color en vivo
Preguntas frecuentes
¿Qué ratio de contraste exige WCAG?+
WCAG 2.1 Nivel AA: 4,5:1 para texto normal, 3:1 para texto grande (18pt+ o 14pt+ negrita). Nivel AAA: 7:1 para texto normal, 4,5:1 para texto grande.
¿Qué se considera texto grande?+
Texto grande es 18pt (24px) o mayor, o 14pt (aproximadamente 18,67px) en negrita.
¿Cómo se calcula el ratio de contraste?+
Ratio de contraste = (L1 + 0,05) ÷ (L2 + 0,05), donde L1 es la luminancia relativa del color más claro y L2 del más oscuro.
Mi ratio es 3,2:1 — ¿es suficientemente bueno?+
Para texto normal, no (AA requiere 4,5:1). Para texto grande (18px+) pasa AA (que requiere 3:1).
¿Qué es la conformidad WCAG AA?+
WCAG AA requiere un ratio de contraste mínimo de 4,5:1 para texto normal y 3:1 para texto grande (18px o 14px en negrita). Es el estándar de accesibilidad más ampliamente requerido.
¿Qué es WCAG AAA?+
WCAG AAA requiere 7:1 para texto normal y 4,5:1 para texto grande. Es el nivel más estricto, recomendado para contenido de alto impacto.