Calculateur de ratio de contraste WCAG
Rédigé par Thierno Sadou Diallo, formule vérifiée selon notre méthodologie • Mis à jour le 17/08/2026
Le ratio de contraste WCAG se calcule à partir de la luminance relative de chaque couleur : ratio = (luminance claire + 0,05) ÷ (luminance sombre + 0,05). Le contraste maximal possible, noir sur blanc, atteint exactement 21:1.
Explication
Les recommandations d'accessibilité WCAG (Web Content Accessibility Guidelines), la référence internationale en matière d'accessibilité numérique, définissent des seuils minimaux de contraste entre le texte et son arrière-plan, pour garantir une lisibilité suffisante aux personnes malvoyantes ou daltoniennes. Le calcul repose sur la luminance relative de chaque couleur, une mesure de sa clarté perçue qui prend en compte le fait que l'œil humain perçoit le vert comme plus lumineux que le rouge, et le rouge comme plus lumineux que le bleu, à intensité égale (d'où les coefficients de pondération différents pour chaque canal de couleur, dérivés des standards de diffusion vidéo). Les seuils officiels de la spécification distinguent plusieurs niveaux de conformité : un ratio d'au moins 4,5:1 pour le niveau AA sur du texte normal (le niveau le plus couramment exigé, notamment par la réglementation sur l'accessibilité numérique dans de nombreux pays), 3:1 pour du grand texte (généralement 18 points ou plus, ou 14 points en gras), et 7:1 pour le niveau AAA, plus exigeant, sur du texte normal. Ce calculateur complète notre calculateur de conversion RVB vers hexadécimal : une fois une palette de couleurs choisie pour un site ou une application, vérifier le contraste entre le texte et son arrière-plan est une étape essentielle avant publication, pour s'assurer que le contenu reste lisible par le plus grand nombre d'utilisateurs possible. Cette même exigence de lisibilité s'étend aux visuels utilisant des proportions standard, comme celles calculées par notre calculateur de rapport d'aspect.
Exemple : texte noir sur fond blanc
Données d'entrée
Couleur 1 : noir (0, 0, 0). Couleur 2 : blanc (255, 255, 255).
Calcul
La luminance relative du noir est 0, celle du blanc est 1. Ratio = (1 + 0,05) ÷ (0 + 0,05) = 1,05 ÷ 0,05 = 21.
Résultat
Le contraste entre noir et blanc atteint 21:1, le maximum possible, largement suffisant pour tous les niveaux WCAG.
Questions fréquentes
Quel niveau de contraste faut-il viser pour un site web ?
Le niveau AA (4,5:1 pour le texte normal, 3:1 pour le grand texte) est le niveau minimal généralement exigé par les réglementations d'accessibilité numérique dans de nombreux pays, et représente un bon compromis entre lisibilité et liberté de design. Le niveau AAA (7:1), plus strict, est recommandé pour les contenus où l'accessibilité est particulièrement critique, mais peut limiter davantage les choix de couleurs disponibles.
Pourquoi le vert compte-t-il plus que le rouge et le bleu dans le calcul de luminance ?
Parce que l'œil humain est physiologiquement plus sensible aux variations de vert qu'aux variations de rouge ou de bleu, à intensité lumineuse égale : c'est pourquoi la formule officielle pondère le canal vert à 71,52 %, contre 21,26 % pour le rouge et seulement 7,22 % pour le bleu. Ces coefficients ne sont pas arbitraires, ils dérivent des standards de perception colorimétrique utilisés en diffusion vidéo.
Pourquoi une correction gamma est-elle appliquée à chaque couleur avant le calcul ?
Parce que les valeurs RVB numériques (0 à 255) ne varient pas de façon linéaire avec la luminosité réellement perçue par l'œil : un pixel à 128 (mi-chemin numérique entre 0 et 255) n'est pas perçu comme deux fois moins lumineux qu'un pixel à 255, en raison de la façon dont les écrans encodent la luminosité. La correction gamma convertit chaque valeur RVB en une valeur linéaire physiquement cohérente avant de calculer la luminance relative.