Outils de Couleur

Vérificateur de contraste des couleurs

Vérifiez le ratio de contraste entre deux couleurs selon les normes WCAG AA et AAA.

Évaluez cet outil

Comment utiliser Vérificateur de contraste des couleurs

  1. Saisissez votre couleur de texte (HEX ou RGB).
  2. Saisissez la couleur de fond.
  3. Consultez le ratio de contraste et les niveaux WCAG respectés.

À propos de Vérificateur de contraste des couleurs

La lisibilité d'un texte sur son arrière-plan est mesurable, et non une affaire de goût. Les directives d'accessibilité WCAG l'expriment sous forme de ratio de contraste allant de 1:1 (deux couleurs identiques) à 21:1 (noir sur blanc). Saisissez une couleur de texte et une couleur de fond au format HEX (#137256 ou #137) ou RGB (rgb(19,114,86)), et ce vérificateur indique le ratio exact à deux décimales, ainsi qu'un résultat de réussite ou d'échec par rapport à quatre seuils : 4,5:1 et 7:1 pour le texte normal (AA et AAA), et 3:1 et 4,5:1 pour le grand texte.

Le calcul repose sur la formule officielle WCAG de luminance relative — chaque canal est linéarisé, puis pondéré selon la luminosité perçue par l'œil — de sorte que le chiffre correspond à ce que rapportent les outils d'audit d'accessibilité. Le ratio compare toujours la couleur la plus claire à la plus sombre, ce qui signifie qu'inverser les deux champs donne exactement le même nombre.

Il compare deux couleurs unies, donc il ne peut pas juger un texte posé sur une photo, un dégradé ou une superposition semi-transparente ; dans ces cas, prélevez d'abord la couleur du pixel derrière le texte. Il n'analyse pas non plus une page en direct — c'est vous qui fournissez les couleurs. Pour traduire une valeur avant de la coller, utilisez le convertisseur de couleurs, et pour construire une palette conforme autour d'une couleur de marque, essayez le générateur de nuances. Rien n'est téléversé.

Questions fréquentes

De quel ratio de contraste ai-je besoin ?

Au moins 4,5:1 pour le texte normal et 3:1 pour le grand texte pour respecter le niveau WCAG AA. Le niveau AAA relève ces seuils à 7:1 et 4,5:1 respectivement. Le vérificateur teste les quatre à la fois, afin que vous voyiez exactement quels niveaux votre paire de couleurs atteint.

Qu'est-ce qui compte comme grand texte ?

Environ 18 pt (24 px) en graisse normale, ou 14 pt (18,66 px) en gras et au-dessus. Tout ce qui est plus petit est traité comme du texte normal et doit respecter le seuil plus strict.

Quels formats de couleur puis-je saisir ?

Le HEX en forme à trois ou six chiffres (#137 ou #137256) et le RGB comme rgb(19,114,86). Chaque champ accepte l'un ou l'autre format, donc vous pouvez les mélanger.

L'ordre dans lequel je saisis les couleurs a-t-il de l'importance ?

Non. La formule divise la luminance la plus claire par la plus sombre, donc le ratio est identique quel que soit l'ordre dans lequel vous les saisissez.

Pourquoi mon texte semble-t-il encore difficile à lire malgré un résultat réussi ?

Le ratio ne mesure que les deux couleurs que vous lui donnez. Les graisses de police fines, les petites tailles, les écrans de basse qualité et le texte sur des images chargées nuisent tous à la lisibilité sans changer le chiffre, donc considérez un résultat réussi comme un plancher plutôt qu'une garantie.