Vérificateur de contraste de couleurs WCAG
Choisissez la couleur du texte et celle du fond et obtenez aussitôt le rapport de contraste et sa conformité aux niveaux AA et AAA des règles d’accessibilité WCAG. Si ce n’est pas conforme, l’outil propose une couleur proche qui l’est. Tout se passe dans votre navigateur.
Traité à 100 % dans votre navigateur
–
Grand : 24 px ou plus, ou 18,66 px en gras.
Titre d’exemple
Voici comment ce texte se lit avec vos couleurs. Un bon contraste aide tout le monde, y compris en plein soleil ou avec une vue fatiguée.
Ctrl + Enter exécuterCtrl + C copier le résultat
Comment l’utiliser
- 1Saisissez ou choisissez la couleur du texte et du fond (hex, rgb, hsl ou nom).
- 2Consultez le rapport de contraste et les résultats AA et AAA.
- 3Regardez l’aperçu avec vos couleurs.
- 4Si ce n’est pas conforme, cliquez sur « Utiliser » pour l’alternative proposée.
Cas d’usage
- Vérifier que les textes de votre site sont lisibles pour les personnes malvoyantes.
- Valider une palette de marque avant de la livrer.
- Respecter les exigences d’accessibilité des sites publics et commerciaux.
- Choisir une couleur de bouton qui ressort sur son fond.
Questions fréquentes
Quel contraste minimal exige WCAG ?
Niveau AA : 4,5:1 pour le texte normal et 3:1 pour le grand texte et les composants d’interface. Niveau AAA : 7:1 pour le texte normal et 4,5:1 pour le grand texte.
Qu’est-ce qu’un grand texte ?
Un texte de 24 px ou plus, ou de 18,66 px ou plus en gras (environ 18 et 14 points). Un contraste plus faible y est admis.
Et si ma couleur est transparente ?
L’outil la mélange d’abord au fond pour obtenir la couleur réellement visible, puis mesure le contraste.
Y a-t-il des exceptions à la règle ?
Oui : le texte décoratif, les logos et les éléments désactivés n’y sont pas soumis, même s’il reste préférable qu’ils soient lisibles.