Comment se calcule le contraste de deux couleurs
Le rapport de contraste compare la luminance relative des deux couleurs, c'est-à-dire la quantité de lumière que chacune renvoie, de 0 pour le noir à 1 pour le blanc. Le RGAA (référentiel général d'amélioration de l'accessibilité) reprend la formule des WCAG dans son glossaire.
(L1 + 0,05) ÷ (L2 + 0,05)L = 0,2126 R + 0,7152 G + 0,0722 Bc ≤ 0,03928 ? c ÷ 12,92 : ((c + 0,055) ÷ 1,055)^2,4L1 est la luminance de la couleur la plus claire, L2 celle de la plus sombre : le rapport va donc de 1:1 (deux couleurs identiques) à 21:1 (noir sur blanc). Le vert pèse beaucoup plus que le bleu dans la luminance, ce qui explique qu'un bleu vif reste sombre et qu'un vert vif paraisse clair.
Les seuils AA et AAA
| Élément | AA (RGAA) | AAA |
|---|---|---|
| Texte courant | 4,5:1 | 7:1 |
| Grand texte | 3:1 | 4,5:1 |
| Composants, graphiques | 3:1 | – |
Pour le RGAA (critère 3.2), un grand texte mesure 24 px ou plus, ou 18,5 px ou plus s'il est en gras. Le critère 3.3 demande 3:1 entre un composant d'interface (bordure d'un champ, bouton, icône seule) ou un graphique porteur d'information et la couleur contiguë. Le niveau AAA vient du critère 1.4.6 des WCAG, publiées par le W3C ; il ne fait pas partie des tests du RGAA.
Le RGAA ne demande pas de contraste pour le texte d'un logo ou d'un nom de marque, pour un texte purement décoratif, ni pour le texte d'un élément désactivé.
Trois exemples
Luminance de l'orange ≈ 0,3162, du blanc 1 : (1 + 0,05) ÷ (0,3162 + 0,05) ≈ 2,86:1. Insuffisant partout, même pour un grand texte (3:1). Couleur de texte conforme AA la plus proche : #c6520f, à 4,55:1.
#767676 atteint 4,54:1 et passe le niveau AA pour tout texte. #777777, plus clair d'une seule unité par canal, tombe à 4,47:1 : il ne convient qu'au grand texte.
Le rapport atteint 7,40:1 : conforme AA et AAA, pour le texte courant comme pour le grand texte.
La couleur conforme la plus proche
Quand le rapport reste sous 4,5:1, l'outil cherche deux corrections : une couleur de texte et une couleur de fond. Pour chacune, il mélange la couleur de départ avec du noir, puis avec du blanc, par pas de 0,1 %, et garde le plus petit mélange qui atteint 4,5:1. Des deux directions, il propose la moins éloignée de votre couleur, avec son rapport. La teinte d'origine reste reconnaissable, seule sa clarté change.
C'est une méthode propre à l'outil, pratique pour corriger une charte sans la trahir, et non une exigence du RGAA : toute couleur qui atteint le seuil convient. Pensez à vérifier aussi les états de survol et de focus, qui ont souvent leur propre couleur.
L'erreur fréquente : arrondir le rapport
Arrondi à une décimale, 4,478 devient 4,5 et semble passer. Mais le seuil se compare au rapport exact : le W3C précise, dans les explications de ses critères, qu'un rapport de 4,499:1 ne satisfait pas une exigence de 4,5:1. L'outil compare donc le rapport non arrondi, et l'affiche tronqué à deux décimales (4,47:1), jamais arrondi au-dessus.
Questions fréquentes
Quel contraste faut-il pour être conforme au RGAA ?
Un rapport de 4,5:1 au moins entre un texte et son arrière-plan, et 3:1 pour un texte de 24 px et plus, ou de 18,5 px et plus en gras (critère 3.2). Les composants d'interface et les éléments graphiques porteurs d'information demandent 3:1 avec la couleur contiguë (critère 3.3).
Quelle différence entre AA et AAA ?
Ce sont deux niveaux des WCAG. Le niveau AA, repris par le RGAA, demande 4,5:1 pour le texte courant et 3:1 pour le grand texte. Le niveau AAA, plus exigeant, demande 7:1 et 4,5:1. Les tests du RGAA reprennent le critère 1.4.3 des WCAG, de niveau AA ; le critère AAA du contraste (1.4.6) figure dans la liste des critères AAA que le RGAA publie à part.
Le texte d'un logo doit-il être contrasté ?
Non : le RGAA ne s'applique pas au texte d'un logo ou d'un nom de marque, au texte purement décoratif, ni à celui d'un élément désactivé sur lequel aucune action n'est possible.
Un texte gris sur fond blanc est-il conforme ?
Cela dépend du gris. Sur un fond blanc, #767676 atteint 4,54:1 et passe le niveau AA pour tout texte ; #777777, à peine plus clair, n'atteint que 4,47:1 et échoue pour le texte courant.
Comment l'outil choisit-il la couleur conforme la plus proche ?
Il mélange la couleur avec du noir, ou avec du blanc, par petits pas, et garde le premier mélange qui atteint 4,5:1 : le moins éloigné de votre couleur des deux. C'est une méthode de l'outil, pas une règle du RGAA ; d'autres choix de couleur peuvent convenir.
Vérifié le 11 octobre 2026 sur RGAA, critères 3.2 et 3.3 (accessibilite.numerique.gouv.fr), RGAA, glossaire : contraste (accessibilite.numerique.gouv.fr) et RGAA, liste des critères AAA (accessibilite.numerique.gouv.fr).
Une erreur ? Signalez-la, nous la corrigeons.