Vérificateur de contraste

Comment ça marche

1. Tapez une paire par ligne : #333 sur #fff. Une virgule, une barre oblique ou une simple espace conviennent aussi.
2. Donnez une seule couleur et elle est comparée au fond indiqué au-dessus.
3. Lisez d’abord le rapport ; tout le reste en découle.
4. 4,5 est le nombre à dépasser pour du texte courant.

Questions fréquentes

Qu’exigent exactement AA et AAA ?

AA demande 4,5 : 1 pour le texte courant et 3 : 1 pour le grand texte — 24 px, ou 18,66 px en gras. AAA demande 7 : 1 et 4,5 : 1. Les bordures, les icônes et les contours des champs de formulaire ont besoin de 3 : 1.

Pourquoi mon gris échoue-t-il ?

#777 sur blanc donne 4,48 : 1 et rate AA de deux centièmes. C’est l’échec de justesse classique, et la raison même pour laquelle on vérifie : cela paraît très bien à qui a choisi la couleur, et c’est réellement difficile à lire pour beaucoup de gens. #757575 passe.

L’ordre des couleurs compte-t-il ?

Non. Le rapport est symétrique : texte sur fond et fond sur texte donnent le même nombre.

Un rapport suffisant suffit-il à parler d’accessibilité ?

Non. Le contraste est une exigence parmi d’autres et ne dit rien des états de focus, des zones cliquables, des animations, ni du fait que la couleur porte à elle seule une information. C’est un plancher, pas un verdict.