Comprobador de contraste de color
Calcula la relación de contraste entre dos colores y comprueba los umbrales de legibilidad para texto normal y grande.
Ejecutar herramienta
Comprueba la legibilidad y la relación de contraste entre dos colores de forma directa en línea. La herramienta evalúa el contraste entre un color de primer plano y un color de fondo para determinar la claridad visual de un texto. Puedes introducir los valores en formato hexadecimal de tres o seis dígitos precedidos por almohadilla, como #000 o #ffffff, o en formato RGB con tres números enteros separados por comas.
Por defecto, los campos toman el negro (#000000) para el texto y el blanco (#ffffff) para el fondo. El cálculo redondea la proporción de contraste a dos decimales y evalúa cuatro umbrales técnicos de referencia: 4,5 y 7,0 para texto normal, así como 3,0 y 4,5 para texto grande. Si ambos tonos coinciden, la proporción resultante es 1,0. Cuando el formato de algún tono no resulta válido, aparece un aviso en pantalla en lugar de los umbrales habituales.
Instrucciones
- Introduce el color de primer plano en formato hexadecimal (#fff o #ffffff) o RGB (rgb(255, 255, 255)). Si lo dejas vacío, se usa #000000.
- Indica el color de fondo con el mismo formato admitido. Si lo dejas vacío, se usa #ffffff.
- Inicia la comprobación para calcular la proporción de contraste y revisar los umbrales para texto normal y grande.
Ejemplos
- Texto negro (#000000) sobre fondo blanco (#ffffff): genera una relación de contraste de 21,0 y supera todos los umbrales de texto normal y grande.
- Texto gris (#767676) sobre fondo blanco (#ffffff): produce una relación de contraste de 4,54, alcanzando el umbral de 4,5 para texto normal y los umbrales de texto grande.
Preguntas frecuentes
¿Qué formatos de color acepta la herramienta?
Acepta códigos hexadecimales de 3 y 6 dígitos precedidos por # (como #333 o #333333) y formatos RGB que incluyan tres números decimales separados por comas (como rgb(51, 51, 51)).
¿Qué ocurre si no se introduce ningún valor en los campos?
La herramienta utiliza automáticamente los valores por defecto: color negro (#000000) para el texto y blanco (#ffffff) para el fondo.
¿Cómo se evalúan los umbrales de contraste?
El sistema calcula la proporción redondeada a dos decimales y evalúa los requisitos de 4,5 y 7,0 para texto normal, junto con 3,0 y 4,5 para texto grande.
¿Qué sucede si el formato de un color no es válido?
Si un código de color no se puede interpretar, la herramienta presenta un aviso explicativo y omite la tabla de evaluación de contraste.