Vérifier le contraste des couleurs (WCAG) – Gratuit
Gratuit, sans inscription, fonctionne dans votre navigateur. Vérifiez si un texte est lisible sur son fond grâce au ratio de contraste WCAG, consultez les résultats AA et AAA pour le texte normal, le grand texte et les éléments d'interface, et obtenez la couleur conforme la plus proche.
Un grand texte ressemble à ceci
Un texte courant normal ressemble à ceci. Portez ce vieux whisky au juge blond qui fume, et les petits caractères, comme une légende, se trouvent dessous.
Petit texte : légende en 14px.
BoutonTaux de contraste13.08:1
- Texte normal, AA : RéussiTexte courant, au moins 4,5:1
- Texte normal, AAA : RéussiRenforcé, au moins 7:1
- Grand texte, AA : Réussi18 pt+, ou 14 pt+ en gras, au moins 3:1
- Grand texte, AAA : RéussiRenforcé, au moins 4,5:1
- Icônes et contrôles, AA : RéussiBoutons, bordures, lignes de graphique : 3:1
Utilise la formule de contraste WCAG 2. Les taux ne sont jamais arrondis à la hausse : 4,49:1 ne compte pas comme 4,5:1. Vérifié sur votre appareil.
Pourquoi utiliser Vérificateur de contraste
- 100 % gratuit
- Utilisez-le aussi souvent que vous voulez. Sans inscription, sans filigrane, rien à installer.
- Confidentiel par conception
- Ce que vous saisissez reste dans votre navigateur et ne nous est jamais envoyé.
- Fonctionne sur tous les appareils
- Fonctionne dans votre navigateur sous Windows, Mac, Linux, Android et iPhone. Aucune application nécessaire.
Comment utiliser Vérificateur de contraste
- Saisissez la couleur du texte et celle du fond, ou choisissez-les.
- Lisez le ratio de contraste et les résultats conforme ou non conforme.
- En cas d'échec, cliquez sur une couleur suggérée conforme.
Questions fréquentes
- Quel ratio de contraste me faut-il ?
- Le niveau WCAG AA exige 4,5:1 pour le texte normal et 3:1 pour le grand texte et les éléments d'interface comme les boutons et les icônes. Le niveau AAA exige 7:1 et 4,5:1.
- Qu'est-ce qu'un grand texte ?
- Au moins 18 points (24px) en normal, ou 14 points (environ 18,7px) en gras.
- Les couleurs de texte transparentes sont-elles prises en charge ?
- Oui. Une couleur de texte transparente est fusionnée avec le fond avant la mesure du contraste.
- Pourquoi 4,49:1 échoue-t-il ?
- Les WCAG précisent que les ratios ne doivent pas être arrondis au-dessus : tout ce qui est inférieur à 4,5:1 ne respecte pas le niveau AA pour le texte normal.
- Vérificateur de contraste est-il gratuit ?
- Oui. Il est gratuit, sans inscription et sans rien à installer.
Outils associés
- Convertisseur HEX en RGBConvertissez une couleur entre HEX, RGB, HSL, HSV et CMYK en une seule étape, transparence comprise. Collez un code dans n'importe quel format ou choisissez une couleur, puis copiez le format voulu et vérifiez le contraste du texte.
- Générateur de palettes de couleursGénérez des palettes de couleurs d'une simple touche, verrouillez les couleurs qui vous plaisent, ou créez-en une à partir d'une couleur de base avec des harmonies analogues, complémentaires ou triadiques. Exportez en variables CSS, Tailwind ou JSON.
- Trouver le nom d'une couleurTrouvez le nom de n'importe quelle couleur : collez un code HEX, RGB ou HSL et obtenez les noms de couleurs CSS les plus proches, une description simple et la liste complète des 148 couleurs nommées à parcourir.