Comprobador de contraste de color

Qué se considera texto grande

WCAG define el texto grande como texto de al menos 18 puntos, aproximadamente 24 píxeles CSS, o de 14 puntos en negrita, aproximadamente 18,7 píxeles. Solo el texto de esos tamaños puede usar el umbral inferior de 3:1; el texto normal, los pies de imagen y las etiquetas de formularios necesitan 4,5:1 para AA. Las proporciones van de 1:1 para colores idénticos a 21:1 para negro sobre blanco. Los contornos de botones, los bordes de campos de formulario, los indicadores de foco y los iconos significativos están sujetos a una regla aparte, el contraste no textual, que exige 3:1 respecto a los colores adyacentes.

Colores transparentes y excepciones

El comprobador necesita colores sólidos. Para texto o superposiciones semitransparentes, calcula el color que se muestra realmente mezclándolo con el fondo en el mezclador de colores, usando la opacidad como peso, y compruébalo.

Los controles desactivados, la decoración pura y los logotipos están exentos de las reglas de contraste. El texto de marcador de posición de un campo de formulario no lo está; por eso los marcadores de posición gris pálido son uno de los fallos más habituales.

Cómo se usa

1. Introduce valores #RGB o #RRGGBB válidos y cualquier porcentaje solicitado.
2. Ejecuta la operación de color fija a nivel local en el navegador.
3. Revisa las muestras de color y copia el resultado o los valores de la paleta.

Privacidad y límites

Los valores de color se quedan en este dispositivo. El resultado de contraste es un verificador matemático, no una garantía general de conformidad con WCAG; el contexto, el renderizado de fuentes, el contraste no textual y los estados de la interfaz de usuario todavía requieren revisión.