Comment utiliser le convertisseur de couleurs et le vérificateur de contraste
- Tapez une couleur au format HEX (
#4f46e5),rgb()ouhsl(), ou utilisez le sélecteur. - Entrez une couleur d'arrière-plan pour vérifier le contraste.
- Consultez le rapport de contraste et s'il répond aux normes WCAG AA et AAA pour les textes normaux et de grande taille.
Comprendre les rapports de contraste
Les directives pour l'accessibilité du contenu Web (WCAG) comparent la luminosité relative de deux couleurs sur une échelle allant de 1:1 (identique) à 21:1 (noir sur blanc).
- AA nécessite au moins 4,5 : 1 pour le texte normal et 3 : 1 pour le texte volumineux (environ 24 px ou 19 px en gras).
- AAA a besoin de 7:1 pour un texte normal et de 4,5:1 pour un texte volumineux.
Un bon contraste aide tout le monde à lire sous une lumière vive ou sur des écrans de mauvaise qualité, et pas seulement les personnes malvoyantes.
Exemples
Contraste 6,29:1 · réussit AA, échoue AAA pour un texte normal
#5048E5 · RVB (80, 72, 229)