Vérificateur d'Accessibilité des Couleurs
Entrez une couleur de premier plan et d'arrière-plan (codes hexadécimaux) pour vérifier leur ratio de contraste et leur conformité WCAG.
Ceci est du texte large en gras.
Ceci est du texte de taille normale.
21.00:1
Ratio de Contraste
Texte Normal (AA)
Texte Large (AA)
18pt+ or 14pt+ bold
Composants UI (AA)
Buttons, form controls, etc.
Level AA (minimum required for accessibility compliance):
• Normal Text: Contrast ratio of at least 4.5:1
• Large Text: Contrast ratio of at least 3:1
• UI Components: Contrast ratio of at least 3:1
Level AAA (enhanced accessibility):
• Normal Text: Contrast ratio of at least 7:1
• Large Text: Contrast ratio of at least 4.5:1
Notes:
• "Large Text" is defined as 18pt or 14pt bold and above
• Logos and decorative elements have no minimum contrast requirement
• Text over images or gradients should be evaluated throughout the image
Comment utiliser Vérificateur d'Accessibilité des Couleurs
- 1
Saisissez deux couleurs
Indiquez une couleur de premier plan (texte) et une couleur d'arrière-plan sous forme de codes hexadécimaux, par exemple #1a1a1a et #ffffff.
- 2
Vérifiez le contraste
Cliquez sur Vérifier l'accessibilité pour calculer le rapport de contraste entre les deux couleurs.
- 3
Examinez les résultats WCAG
Consultez les badges réussite ou échec pour les niveaux AA et AAA en texte normal, grand texte et composants d'interface, et visualisez l'aperçu en direct.
- 4
Ajustez si nécessaire
Intervertissez les couleurs ou modifiez une valeur hexadécimale jusqu'à ce que la combinaison atteigne le niveau WCAG requis par votre projet.
Questions fréquentes
Qu'est-ce qu'un rapport de contraste et qu'est-ce qui est considéré comme bon ?
Quelle est la différence entre AA et AAA ?
Pourquoi le grand texte réussit-il alors que le texte normal échoue ?
Quel format de couleur dois-je saisir ?
Le vérificateur est-il gratuit et envoie-t-il mes couleurs quelque part ?
Outils similaires
Continuez avec ces outils pratiques