Aller au contenu
EN

Vérificateur de contraste des couleurs (WCAG)

Vérifiez le contraste entre la couleur du texte et du fond selon les règles WCAG AA et AAA, et obtenez la couleur corrigée la plus proche en un clic.

  • Gratuit
  • Sans inscription
  • Aucun fichier envoyé
  • Windows, Mac, Android, iPhone

Chargement de l'outil…

À propos de cet outil

Vérifiez qu'un texte est lisible sur son fond selon les règles d'accessibilité WCAG 2 : rapport de contraste, critères AA et AAA pour le texte courant, les grands textes et les éléments d'interface, aperçu réel. Si le contraste est insuffisant, l'outil propose la couleur de texte ou de fond la plus proche qui passe.

Dans quels cas l'utiliser ?

Valider une charte graphique

Avant de fixer les couleurs d'un site, vérifiez chaque combinaison texte/fond : les gris clairs à la mode échouent souvent.

Corriger un audit d'accessibilité

Un audit RGAA ou WCAG signale des contrastes insuffisants : la correction automatique donne la nuance la plus proche de l'original qui passe.

Boutons et icônes

Les bordures de champs, icônes et boutons doivent atteindre 3 : 1 avec le fond pour être repérables.

Mode d'emploi

  1. Choisissez la couleur du texte et celle du fond.
  2. Lisez le rapport de contraste et les critères WCAG réussis.
  3. Appliquez une couleur corrigée si le contraste est insuffisant.

Comment ça marche

Le rapport de contraste est calculé avec la formule WCAG : luminance relative de chaque couleur (après conversion de sRGB en lumière linéaire), puis (L1 + 0,05) / (L2 + 0,05). Il va de 1 : 1 (aucun contraste) à 21 : 1 (noir sur blanc).

La correction parcourt la luminosité de la couleur, vers le clair et vers le foncé, et retient la valeur qui atteint le seuil avec le plus petit écart : la couleur reste reconnaissable.

Conseils pour un bon résultat

  • Visez 4,5 : 1 pour tout texte de moins de 24 px, même les mentions légales.
  • Le texte sur une photo doit être vérifié sur la zone la plus claire de la photo.
  • Le contraste ne suffit pas : ne transmettez jamais une information par la couleur seule.
  • Testez aussi vos couleurs avec le simulateur de daltonisme.

Problèmes fréquents et solutions

Aucune couleur corrigée n'est proposée

Même le noir ou le blanc n'atteint pas le seuil sur ce fond (gris moyen, par exemple). Changez la couleur du fond.

Le résultat diffère d'un autre outil

Les arrondis varient légèrement ; un rapport juste sous le seuil (4,49) échoue partout.

Mon texte en couleur transparente

Le calcul porte sur des couleurs opaques : utilisez la couleur visible réelle (mélangée au fond).

Questions fréquentes

Quel contraste faut-il ?

WCAG AA demande 4,5 : 1 pour le texte courant et 3 : 1 pour les grands textes et les éléments d'interface. Le niveau AAA demande 7 : 1 et 4,5 : 1.

Qu'est-ce qu'un grand texte ?

Au moins 24 px (18 pt), ou 18,5 px (14 pt) en gras. En dessous, le seuil du texte courant s'applique.

Comment sont calculées les couleurs corrigées ?

L'outil garde la teinte et la saturation de votre couleur et ajuste seulement sa luminosité, au plus près, jusqu'à atteindre le seuil AA ou AAA.

Le contraste est-il obligatoire ?

Pour les sites publics de nombreux pays (RGAA en France, directive européenne sur l'accessibilité), le niveau AA est exigé. C'est surtout une question de lisibilité pour tous, au soleil comme avec une vue fatiguée.

Recherches associées

Toujours bloqué ?

Posez votre question sur le forum : la catégorie, l'outil, la fiche de votre appareil et le résultat du test seront déjà remplis.