Aller au contenu principal

Vérificateur de contraste

Votre texte est-il assez lisible sur sa couleur de fond ? Choisissez les deux couleurs : le résultat indique tout de suite si le contraste convient à tout le monde, y compris aux personnes malvoyantes.Le calcul suit les règles internationales d’accessibilité (WCAG 2.2). Tout se passe dans votre navigateur.

Vos couleurs

Cliquez sur une couleur pour la modifier ou coller un code.

Résultat

4,29 : 1

Limité

Trop faible pour du texte courant. Acceptable seulement pour les gros titres, les boutons et les icônes.

Couleurs conformes les plus proches

AA · 4,5 : 1

  • Texte plus clair#E0DBF9Atteint : 4,50 : 1
  • Fond plus foncé#5C51B4Atteint : 4,53 : 1

AAA · 7 : 1

  • Fond plus foncé#423394Atteint : 7,00 : 1

Les couleurs les plus proches des vôtres qui atteignent l’objectif, même teinte. Calcul sur les couleurs opaques.

  • Texte courant

    Paragraphes, liens, libellés

  • Grand texte

    Titres, 24 px ou 18,66 px gras

  • Composants d’interface

    Boutons, champs, icônes

Détail technique

Détail des critères WCAG de contraste
CritèreSeuilRésultat
1.4.3 AATexte courant4,5 : 1Échoué
1.4.3 AAGrand texte3 : 1Réussi
1.4.6 AAATexte courant7 : 1Échoué
1.4.6 AAAGrand texte4,5 : 1Échoué
1.4.11 AAComposants3 : 1Réussi

Grand texte : 24 px ou plus, ou 18,66 px en gras. Les seuils ne sont jamais arrondis : 4,499 échoue à 4,5.

Qu’est-ce que WCAG 2.2 ?

Les WCAG (Web Content Accessibility Guidelines) sont les règles internationales d’accessibilité du web, publiées par le W3C. La version 2.2 date de 2023. En France, le RGAA s’appuie sur elles et la loi impose le niveau AA. Le contraste y est mesuré par un ratio entre 1 : 1 (aucune différence) et 21 : 1 (noir sur blanc).

Comprendre le contraste WCAG

Autres mesures du contraste Informatif

D’autres formules mesurent l’écart entre deux couleurs. Elles servent aux designers et aux experts pour comprendre un résultat limite. Elles n’ont aucune valeur réglementaire : seul le résultat WCAG 2.2 fait foi.

Autres mesures du contraste
MesureValeurRepère
Différence de luminositéAncienne méthode du W3C (AERT, 2000), abandonnée119,6 / 255125 ou plus. Sous le repère.
Différence de couleurMême méthode AERT313 / 765500 ou plus. Sous le repère.
Contraste de WeberUtilisé en sciences de la vision3,295Pas de seuil. Négatif quand le texte est plus sombre que le fond.
Contraste de MichelsonPrévu pour les motifs et rayures, peu adapté au texte0,698Pas de seuil.
Écart de clarté ΔL*CIELAB, identique à l’écart de tonalité HCT de Material Design45,0Repères Material : 40 (≈ 3 : 1) et 50 (≈ 4,5 : 1).
Écart de couleur ΔE 2000Formule de référence de l’industrie40,6Environ 1 : différence à peine visible.
Écart de couleur ΔE 76Ancienne formule de ΔE62,8Pas de seuil.
Écart de clarté OKLabEspace de couleur moderne, utilisé en CSS0,378Pas de seuil.