¿qué es Contrast Finder?
Contrast-Finder es una herramienta que calcula el contraste entre dos colores (fondo, primer plano) y comprueba si el contraste es válido. Cuando el contraste no es válido, el objetivo principal es sugerir algunos contrastes de colores correctos.
Contrast-Finder está diseñado para ser utilizado por diseñadores web, desarrolladores web o profesionales de la accesibilidad web para mejorar la legibilidad de las páginas HTML y los sitios web.
Ayuda / Cómo utilizar esta herramienta?,
La interfaz Contrast-Finder es un formulario con cinco campos obligatorios.
- color de Texto
- color de Fondo
- relación Mínima
- Color para editar
- Dame
color de Texto / primer plano
Este es el color del texto. Puede rellenar este campo con una palabra clave de color, un valor hexadecimal o un valor RGB. El valor de entrada se previsualiza a la derecha del campo.
Color de la palabra clave
Ejemplo: Black, Silver, YellowGreen, MediumPurple., los valores autorizados son los enumerados en las palabras clave de color CSS (del nivel CSS 1 al nivel CSS 4).
Color con valores hexadecimales
Ejemplo: #AABBCC. Tenga en cuenta que #ABC también funciona, completamos automáticamente el campo con #AABBCC. También puede usar este campo sin el carácter #, por lo que FFF o FFFFFF funciona perfectamente.
Color con valores RGB
Ejemplo: rgb(255,255,255)., también puede usar una sintaxis corta como 255,255,255, que se interpretará como rgb(255,255,255).
color de Fondo
Este es el color del fondo.
este campo funciona igual que el campo de color del texto.
relación mínima
tres posibles valores 3, 4,5 y 7.
¿Cómo elegir una relación? Depende de los siguientes elementos:
- Nivel de accesibilidad deseado: AA o AAA.
- Tamaño del texto.
- ¿El texto está en negrita o no?,
nivel AA
dos elementos (tamaño y negrita) da cuatro combinaciones:
nivel AAA
para el nivel AAA la lógica es la misma, solo que la relación aumenta de la siguiente manera:
- La relación 4.5 se convierte en 7
- La relación 3 se convierte en 4.5
19px los criterios pueden entenderse como equivalentes a 14pto120%o1.2em.,
24px criterios puede ser entendido como equivalente de 18pt o 150% o 1.5em. para una comprensión completa y exhaustiva de cómo interpretar el tamaño del texto, se debe leer la definición de texto a gran escala de WCAG.
todos los detalles sobre la relación de contraste
Color para editar
es el color de texto o de fondo. El valor predeterminado es el color del texto.
El color que elija se modificará hasta que encontremos un color válido. El otro color no cambiará.,
Gimme / the algorithms
«colores válidos y muy cercanos al color inicial»
Este es el algoritmo predeterminado. Ofrece opciones de color muy cercanas al color inicial. (La distancia de Color se calcula sobre una base matemática, que puede variar desde el punto de vista del diseñador.)
para algunas combinaciones de colores, el algoritmo puede no dar ningún resultado ; en tal caso, use el otro algoritmo.
«un rango de colores válidos»
Este es el algoritmo de respaldo, en caso de que el primero no dé resultado. Sin embargo, las opciones de color pueden ser (fuertemente) diferentes del color inicial.,
comentarios de los usuarios
Si tiene algún problema o pregunta sobre Contrast-Finder, contáctenos:
- Asqatasun forum
- Twitter @Contrast_Finder
- Contrast-Finder en Github