Vérificateur de Contraste
Le vérificateur de contraste calcule le ratio de contraste WCAG 2.1 entre une couleur de texte et une couleur de fond, et indique si la combinaison réussit les niveaux AA et AAA pour le texte normal et le grand texte.
À propos de cet outil
Le vérificateur de contraste calcule le ratio de contraste WCAG 2.1 entre une couleur de texte et une couleur de fond, et indique si la combinaison réussit les niveaux AA et AAA pour le texte normal et le grand texte.
Mode d’emploi
- Saisissez ou choisissez la couleur du texte.
- Saisissez ou choisissez la couleur du fond (les valeurs hexadécimales fonctionnent, y compris l’écriture abrégée à 3 chiffres).
- Lisez le ratio de contraste et les résultats AA/AAA pour le texte normal et le grand texte.
- Ajustez l’une ou l’autre couleur jusqu’à atteindre le niveau requis.
Bon à savoir
- Le niveau WCAG 2.1 AA exige un ratio de contraste d’au moins 4.5:1 pour le texte normal et 3:1 pour le grand texte.
- Le niveau WCAG 2.1 AAA exige au moins 7:1 pour le texte normal et 4.5:1 pour le grand texte.
- Un grand texte fait au moins 18 pt (24 px) en graisse normale ou 14 pt (environ 18.66 px) en gras.
- Les ratios de contraste vont de 1:1 (couleurs identiques) à 21:1 (noir sur blanc).
- Le ratio est calculé à partir de la luminance relative de chaque couleur, selon la formule WCAG.
Fonctionne entièrement dans votre navigateur : rien de ce que vous saisissez n’est envoyé ni stocké.
Questions fréquentes
Quel ratio de contraste faut-il pour l’accessibilité ?
Pour le niveau WCAG 2.1 AA, le texte normal doit atteindre au moins 4.5:1 et le grand texte au moins 3:1. Le niveau AAA porte ces seuils à 7:1 et 4.5:1.
Un texte blanc sur fond vert est-il accessible ?
Cela dépend de la nuance. Beaucoup de verts vifs échouent au niveau AA avec du texte blanc ; les verts plus foncés passent généralement. Saisissez vos valeurs hexadécimales exactes pour vérifier.
Qu’est-ce qu’un grand texte selon les WCAG ?
Un texte d’au moins 18 points (24 px) en graisse normale, ou d’au moins 14 points (environ 18.66 px) en gras.
Le contraste WCAG s’applique-t-il aux boutons et aux icônes ?
Le critère de succès 1.4.11 des WCAG 2.1 demande un contraste d’au moins 3:1 entre les composants d’interface ou les graphiques porteurs de sens et leur environnement.