Vérificateur de contraste des couleurs
Saisissez deux couleurs et consultez instantanément le rapport de contraste WCAG avec les indications AA et AAA.
Saisissez des couleurs de premier plan et d'arrière-plan en hex ou RGB pour calculer instantanément le rapport de contraste WCAG, voir les résultats AA/AAA, prévisualiser le texte et obtenir des suggestions d'ajustement.
Comment utiliser ce vérificateur de contraste des couleurs
Saisissez ou collez une couleur de premier plan et une couleur d'arrière-plan. L'outil normalise les entrées valides en hex majuscules, calcule instantanément le rapport de contraste WCAG et affiche réussi ou échec pour les seuils AA et AAA. Utilisez Suggérer une correction pour rapprocher une couleur de la conformité, partagez via l'URL ou réinitialisez.
Seuils de rapport de contraste WCAG
WCAG 2.x exige au moins 4,5:1 pour le texte normal (AA), 3:1 pour le grand texte (AA), 7:1 pour le texte normal (AAA) et 4,5:1 pour le grand texte (AAA). Cet outil affiche toujours les quatre résultats pour comparer les niveaux.
Formats de couleur pris en charge
Saisissez #RGB, #RRGGBB, rgb(r,g,b) ou des valeurs r,g,b séparées par des virgules. Les canaux doivent être des entiers de 0 à 255. La transparence alpha, le hex 8 chiffres, HSL/HSLA et les couleurs nommées CSS ne sont pas pris en charge en v1.
Ce que signifient réussi et échec
Réussi signifie que le rapport calculé atteint ou dépasse le seuil indiqué pour ce niveau. Échec signifie qu'il ne l'atteint pas. Des libellés et des icônes accompagnent la couleur pour que les résultats restent compréhensibles sans s'appuyer uniquement sur la couleur.
Questions Fréquemment Posées
Pourquoi l'alpha et les dégradés ne sont-ils pas pris en charge ?
La version 1 n'évalue que des couleurs sRGB entièrement opaques. Le mélange alpha et les dégradés nécessitent des règles de composition que cet outil ne modélise pas encore ; rgba(), le hex 8 chiffres et l'analyse des dégradés sont donc hors périmètre MVP.
Comment le rapport de contraste est-il calculé ?
L'outil utilise la formule de luminance relative WCAG pour des couleurs sRGB opaques : linéarisation de chaque canal, calcul de la luminance, puis (plus clair + 0,05) / (plus sombre + 0,05). Les rapports affichés sont arrondis à deux décimales ; les seuils utilisent la valeur complète.
Que fait Suggérer une correction ?
Il déplace de façon déterministe la couleur de premier plan ou d'arrière-plan sélectionnée le long d'un chemin de luminosité vers le noir ou le blanc jusqu'à atteindre le niveau WCAG choisi, en renvoyant le hex conforme le plus proche et le rapport obtenu lorsqu'il existe.
Puis-je partager une paire de couleurs précise ?
Oui. Les valeurs valides de premier plan, d'arrière-plan et de taille de texte sont synchronisées dans les paramètres d'URL (par exemple ?fg=000000&bg=FFFFFF&size=normal) pour lier directement un résultat.
La page enregistre-t-elle mes couleurs ?
Les calculs s'exécutent entièrement dans votre navigateur. La dernière paire de couleurs valide peut être enregistrée dans localStorage sur votre appareil ; utilisez Réinitialiser pour effacer les saisies, les paramètres d'URL et l'état stocké.