Convertisseur Gratuit

Contraste de Couleur Vérificateur (WCAG)

Vérifiez le rapport de contraste entre deux couleurs pour la conformité d'accessibilité WCAG AA et AAA. Gratuit, instantané et entièrement dans le navigateur.

Texte Exemple — Taille Normale

Petit texte exemple — 14px

Rapport de Contraste:21.00:1
WCAG AATexte NormalRéussi
WCAG AAGrand TexteRéussi
WCAG AAATexte NormalRéussi
WCAG AAAGrand TexteRéussi

À propos de cet outil

Vérifiez les rapports de contraste des couleurs entre le texte de premier plan et les couleurs d'arrière-plan conformément aux directives d'accessibilité WCAG 2.1. Entrez les couleurs sous forme de codes hexadécimaux, de valeurs RVB ou de valeurs HSL et consultez instantanément le rapport de contraste ainsi que les résultats de réussite/échec pour la conformité WCAG AA et AAA dans des tailles de texte normales et de grande taille.

Comment l'utiliser

  1. Entrez ou choisissez votre couleur de premier plan (texte) à l'aide du sélecteur de couleurs ou de la saisie hexadécimale.
  2. Entrez ou choisissez votre couleur d'arrière-plan.
  3. Visualisez instantanément le rapport de contraste et les résultats réussite/échec WCAG 2.1 AA/AAA.
  4. Ajustez les couleurs jusqu'à ce que vous obteniez le niveau de conformité souhaité.

Questions fréquentes

Quel rapport de contraste est requis pour la conformité WCAG ?
WCAG AA nécessite 4,5:1 pour le texte normal et 3:1 pour le texte volumineux (18 pt+ ou 14 pt+ gras). WCAG AAA nécessite 7:1 pour le texte normal et 4,5:1 pour le texte volumineux. Le rapport maximum possible est de 21:1 (noir sur blanc).
Pourquoi le contraste des couleurs est-il important ?
Un contraste suffisant garantit que le texte est lisible pour les utilisateurs malvoyants, daltoniens ou ceux qui regardent des écrans en plein soleil. Il s'agit également d'une exigence légale en vertu des réglementations d'accessibilité de l'ADA et de l'UE pour de nombreux sites Web.
Qu'est-ce qui est considéré comme un « texte volumineux » dans les WCAG ?
Un texte de grande taille est défini comme 18 pts (24 px) et plus pour un poids normal, ou 14 pts (18,66 px) et plus pour du texte en gras. Les textes volumineux ont des exigences de contraste moindres car ils sont intrinsèquement plus faciles à lire.
Cet outil vérifie-t-il le contraste des éléments non textuels ?
WCAG 2.1 nécessite un rapport de contraste de 3:1 pour les composants de l'interface utilisateur et les objets graphiques (boutons, icônes, champs de formulaire). Vous pouvez également utiliser cet outil pour les vérifier : entrez simplement les couleurs du composant et de l'arrière-plan.