Contrôleur de contraste

Vérifiez les ratios de contraste des couleurs pour la conformité WCAG AA/AAA. Gratuit, instantané, fonctionne hors ligne.

Large Text
Normal text sample for contrast testing
Small / UI text sample
--
Contrast Ratio
--
AA Normal (4.5:1)
--
AA Large (3:1)
--
AAA Normal (7:1)
--
AAA Large (4.5:1)

About WCAG Contrast

WCAG (Web Content Accessibility Guidelines) define minimum contrast ratios for text to be readable:

LevelNormal TextLarge Text (≥18px or bold ≥14px)
AA4.5:13:1
AAA7:14.5:1

Contrast ratio ranges from 1:1 (same colors) to 21:1 (black on white). Higher = better readability.

About Contrast Checker

Vérifiez les ratios de contraste des couleurs pour la conformité WCAG. Testez le texte par rapport aux couleurs d'arrière-plan. Consultez les notes AA et AAA pour le texte normal et le texte agrandi. Essentiel pour les concepteurs et développeurs web qui créent des interfaces accessibles.

Conformité WCAG

Vérifie les normes WCAG 2.1 AA et AAA. Sachez instantanément si votre combinaison de couleurs respecte les exigences d'accessibilité.

Aperçu en direct

Voyez votre texte sur l'arrière-plan en temps réel. Ajustez les couleurs avec des curseurs ou saisissez directement les valeurs HEX/RVB.

Texte normal et agrandi

Notes séparées pour le texte de corps et le texte agrandi/titres. Différents seuils pour chacun — affichés clairement.

Suggestions de couleurs

Obtenez des suggestions plus claires/plus foncées qui respectent les exigences de contraste. Trouvez des alternatives accessibles instantanément.

📋 Common Use Cases

Accessibilité web

Vérifiez que vos couleurs de texte et d'arrière-plan respectent les directives de contraste WCAG AA/AAA pour des sites web lisibles et accessibles.

Revue de conception

Vérifiez les combinaisons de couleurs dans les maquettes UI, les boutons et la typographie avant de les livrer aux utilisateurs.

Choix des couleurs de marque

Confirmez que vos couleurs de marque fonctionnent sur des surfaces claires et sombres avec un contraste suffisant.

Conception de documents et de diapositives

Assurez-vous que le texte dans les documents, présentations et PDFs est lisible pour tous les publics.

🪜 How to Use This Tool

  1. Saisissez vos couleurs
    Choisissez ou collez une couleur de texte (premier plan) et une couleur d'arrière-plan.
  2. Consultez le ratio
    L'outil calcule le ratio de contraste et affiche le résultat instantanément.
  3. Vérifiez la note
    Voyez si la combinaison respecte les normes WCAG AA ou AAA pour le texte normal et le texte agrandi.
  4. Ajustez si nécessaire
    Modifiez les couleurs jusqu'à ce qu'elles atteignent votre niveau d'accessibilité cible.

📚 Related Guides

Frequently Asked Questions

Cet outil de couleurs est-il gratuit ?
Oui. Tous les outils de couleurs sont entièrement gratuits. Aucune inscription n'est nécessaire.
Comment fonctionne le contrôleur de contraste ?
Il calcule les ratios de contraste WCAG 2.1 entre les couleurs de premier plan et d'arrière-plan, en affichant la réussite ou l'échec pour AA et AAA aux tailles de texte normale et agrandie.