Informaclique
Tous les outils

accessibilité · design

Testeur de contraste WCAG

Vérifiez que vos couleurs de texte et de fond sont lisibles par tous : ratio de contraste et conformité aux niveaux AA et AAA des WCAG 2.1.

Grand titre lisible

Voici un paragraphe d’exemple pour juger la lisibilité du texte courant sur ce fond.

Petit texte de mention légale, souvent le plus difficile à lire.

Ratio de contraste

16,77 : 1

  • Texte normal — AA (≥ 4,5)Conforme
  • Grand texte — AA (≥ 3)Conforme
  • Texte normal — AAA (≥ 7)Conforme
  • Grand texte — AAA (≥ 4,5)Conforme
  • Éléments d’interface — AA (≥ 3)Conforme

Questions fréquentes

Quel ratio de contraste faut-il viser ?

Le niveau AA des WCAG, exigé par le RGAA en France, demande au moins 4,5:1 pour le texte courant et 3:1 pour les grands textes (24 px, ou 18,5 px en gras). Le niveau AAA demande 7:1 et 4,5:1.

Comment est calculé le ratio ?

On compare la luminance relative des deux couleurs : (L1 + 0,05) / (L2 + 0,05), où L1 est la plus claire. Le résultat va de 1:1 (aucun contraste) à 21:1 (noir sur blanc).

Le contraste concerne-t-il aussi les boutons et icônes ?

Oui, les composants d’interface et les éléments graphiques porteurs d’information doivent atteindre au moins 3:1 avec leur arrière-plan.

Cet outil vous a été utile ?

Imaginez ce qu'on peut faire pour votre entreprise avec des solutions sur-mesure. Recevez un audit gratuit et des recommandations personnalisées.

100% gratuit · Zero engagement · Reponse sous 24h

Création, maquette & mentions

Outils similaires

Voir les 46 outils