Vérificateur de Contraste de Couleur
Vérifiez le ratio de contraste WCAG entre le texte et l'arrière-plan.
Cet outil fonctionne entièrement dans votre navigateur. Vos fichiers ne sont jamais envoyés à un serveur.
17.74:1
Contrast ratio
Pass
AA — normal text
Pass
AA — large text
Pass
AAA — normal text
Pass
AAA — large text
Ce que fait ce vérificateur
Calcule le ratio de contraste de luminance relative WCAG entre une couleur de premier plan (texte) et une couleur d'arrière-plan, et indique si ce ratio franchit chaque seuil d'accessibilité.
Comment l'utiliser
Saisissez les couleurs de premier plan et d'arrière-plan en valeurs HEX à trois ou six chiffres. Le ratio de contraste, un aperçu en direct de la paire et les résultats réussite/échec se mettent à jour à la saisie.
Exemple résolu
Un premier plan #767676 sur un fond blanc (#ffffff) donne un ratio de contraste d'environ 4,54:1 — il réussit AA pour le texte normal (4,5:1 requis) et AA pour le texte large, mais échoue à AAA normal (7:1 requis).
Seuils WCAG
L'outil vérifie quatre seuils : AA texte normal 4,5:1, AA texte large 3:1, AAA texte normal 7:1 et AAA texte large 4,5:1. Le texte large signifie 18pt ou plus, ou 14pt en gras.
Pourquoi le contraste compte
Un contraste suffisant garde le texte lisible pour les utilisateurs malvoyants ou daltoniens, et atteindre ces seuils est requis pour les sites conformes WCAG.
Limites
Ceci ne vérifie que les deux couleurs sRGB opaques saisies — taille ou graisse de police, transparence, dégradés, images d'arrière-plan, états d'interaction ou le reste de votre page ne sont pas examinés ; considérez donc une réussite comme une seule vérification, pas un audit complet.
Confidentialité
Le calcul s'exécute entièrement dans votre navigateur ; les couleurs saisies ne sont pas transférées.
Questions Fréquentes
- Quel ratio de contraste faut-il pour WCAG AA ?
- Au moins 4,5:1 pour le texte normal, ou 3:1 pour le texte large (18pt+ ou 14pt+ en gras).
- Et pour WCAG AAA ?
- AAA est plus strict : 7:1 pour le texte normal et 4,5:1 pour le texte large.
- Pourquoi le contraste d'accessibilité est-il important ?
- Un contraste suffisant rend le texte lisible pour les utilisateurs malvoyants ou daltoniens, et est requis pour les sites conformes WCAG.
Outils Similaires
Recherche de Nom de Couleur
Trouvez le nom de couleur le plus proche pour n'importe quel code hex.
Convertisseur de Couleur CMJN
Convertissez toute couleur hex ou RGB en CMJN pour l'impression.
Générateur de Dégradé CSS
Créez un dégradé CSS à deux couleurs et copiez le code instantanément.
Générateur de Couleurs Analogues
Générez un jeu de couleurs analogues harmonieux à partir de n'importe quelle couleur de base.
Simulateur de Daltonisme
Prévisualisez l'apparence d'une couleur avec protanopie, deutéranopie ou tritanopie.
Générateur de Palette de Couleurs
Générez une palette aléatoire de 5 couleurs en un clic.