Contenu principal
Interface utilisateur Design visuel
Solution n° 21

Respectez les contrastes visuels

Respecter les normes de contraste mises en places dans le référentiel RGAA permet à chacun de distinguer les éléments des écrans, peu importe ses déficiences ou les conditions d’utilisation du service.

Il est recommandé de dépasser les normes de contraste lorsque cela est possible.

En savoir plus

Les normes de contrastes du RGAA peuvent être synthétisées de la façon suivante :

Les textes et textes en image sans effet de graisse d’une taille inférieure à 24px ainsi que les textes en gras d’une taille inférieure à 18,5px doivent vérifier les conditions suivantes :

  • Avoir un contraste de 4,5:1
  • Posséder un mécanisme permettant à l’utilisateur d’afficher le texte avec un rapport de contraste de 4,5:1

Les textes et textes en image sans effet de graisse d’une taille supérieure à 24px ainsi que les textes en gras d’une taille supérieur à 18,5px doivent vérifier les conditions suivantes :

  • Avoir un contraste de 3:1
  • Posséder un mécanisme permettant à l’utilisateur d’afficher le texte avec un rapport de contraste de 3:1

Dans le cas où un mécanisme permet d’afficher un rapport de contraste conforme, ce mécanisme lui-même doit respecter les normes de contrastes citées ci-dessus.

Pour plus d’informations, retrouvez les critères du RGAA à ce lien :

https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#3.2

Exemple