Vérificateur de contraste WCAG AA et AAA

Vérifiez le contraste des couleurs WCAG 2.2 AA et AAA, prévisualisez les tailles de texte et trouvez des alternatives accessibles.

Survolez un champ ou sélectionnez-le pour afficher l’aide. Appuyez sur Échap pour fermer.

Premier planArrière-planFond de base opaque

Utilisez HEX, RGB, RGBA ou HSL. Les couleurs transparentes sont composées sur le fond de base opaque.

5.84:1

Les seuils utilisent le rapport en pleine précision, jamais la valeur affichée arrondie.

WCAG 2.2
Niveau	Utilisation	SC	Minimum	Résultat
AA	Texte normal	1.4.3	4.5:1	Réussi
AA	Grand texte	1.4.3	3:1	Réussi
AAA	Texte normal	1.4.6	7:1	Échec
AAA	Grand texte	1.4.6	4.5:1	Réussi
AA	Composants d’interface et éléments graphiques	1.4.11	3:1	Réussi

Texte d’aperçuTaille de police (px CSS)Gras

Aa — fiokit.

Texte normal: AA ✓ · AAA ✗

Grand texte : au moins 24 px CSS, ou 18,67 px CSS en gras (14 pt).

Objectif du premier plan proposéRapport

WCAG 2.2
#155bdf / #ffffff (#ffffff)
5.8433:1
AA Texte normal (SC 1.4.3): PASS — 4.5:1
AA Grand texte (SC 1.4.3): PASS — 3:1
AAA Texte normal (SC 1.4.6): FAIL — 7:1
AAA Grand texte (SC 1.4.6): PASS — 4.5:1
AA Composants d’interface et éléments graphiques (SC 1.4.11): PASS — 3:1

Vérifie les paires de couleurs, pas la conformité WCAG complète. Évaluez séparément les couleurs adjacentes, états interactifs et contenus réels.

W3C — SC 1.4.3 · SC 1.4.6 · SC 1.4.11

Comment ça marche

Définissez le premier plan, l’arrière-plan et le fond opaque. Les résultats AA et AAA se mettent à jour immédiatement. Essayez la taille et la graisse, appliquez une couleur proposée ou téléchargez le rapport.

Un exemple pratique

Couleurs

#155bdf

Questions fréquentes

Mon texte est-il envoyé à un serveur ?

Non. Le contenu est traité dans ce navigateur. Il n’est ni envoyé au serveur ni enregistré.

Que faut-il savoir sur Vérificateur de contraste WCAG AA et AAA ?

Présente séparément les seuils textuels et non textuels. Ce contrôle des couleurs ne certifie pas la conformité WCAG complète.