Introduce texto y fondo y consulta la relación de contraste y el umbral para texto o componentes.
Cambiar de idioma inicia una sesión nueva. Guarda el resultado primero.
Introduce texto y fondo y consulta la relación de contraste y el umbral para texto o componentes.
Solo evalúa contraste de color: no es una auditoría completa de accesibilidad ni una garantía legal. Revisa tamaño y contexto.
Primer plano (texto)
RGB: 30, 41, 59
HSL: 217°, 33%, 17%
Fondo
RGB: 255, 255, 255
HSL: 0°, 0%, 100%
Texto normal (14px) — Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Texto grande (18pt / 24px) — Ejemplo de encabezado
Texto grande en negrita (14 puntos en negrita / ~18,67 px en negrita): también cuenta como texto grande
14.63:1
Relación de contraste
| Contexto | Umbral | WCAG-AA | WCAG AAA |
|---|---|---|---|
| Texto normal | ≥4.5:1 / ≥7:1 | ✓ Aprobado | ✓ Aprobado |
| Texto grande (18 puntos+ o 14 puntos en negrita) | ≥3:1 / ≥4.5:1 | ✓ Aprobado | ✓ Aprobado |
| Componentes de la interfaz de usuario | ≥3:1 | ✓ Aprobado | — |
Genere esquemas de color armoniosos utilizando la teoría del color. Incluye complementarios, análogos, triádicos y más.
🎨 Abrir paleta de colores →WCAG AA exige 4.5:1 para texto normal y 3:1 para texto grande. Un análisis de colores no demuestra por sí solo la conformidad completa de accesibilidad.
AAA aumenta el contraste de texto a 7:1 para texto normal y 4.5:1 para texto grande. Esta herramienta comprueba colores, no el cumplimiento legal.
El texto grande tiene al menos 18pt en peso normal o 14pt en negrita. Compruebe el tamaño y el peso reales de la fuente en el diseño final.
La herramienta calcula la luminancia relativa a partir de RGB linealizado y divide (luminancia más clara + 0.05) entre (luminancia más oscura + 0.05).
Si el texto está sobre un degradado, una imagen o un patrón, compruebe la zona de menor contraste. Un solo par de colores planos no representa todo el fondo.