Vérificateur de contraste WCAG

Collez les couleurs CSS de premier plan et d'arrière-plan pour voir les verdicts WCAG 2.2 AA/AAA et non-texte 3:1 avec le ratio de contraste. HEX, RGB, HSL, OKLCH, color() et couleurs nommées fonctionnent en vue paire et matrice. Vérifié dans votre navigateur, jamais envoyé.

Chargement…
Vérificateur de contraste WCAG
Collez des couleurs CSS pour lire le ratio de contraste et la conformité WCAG 2.2. Le mode matrice accepte jusqu'à 16 couleurs par axe et affiche une erreur au-delà. APCA est optionnel, marqué bêta et jamais fusionné aux scores WCAG.

Notes développeur

WCAG 2.2 est la référence réussite/échec par défaut (1.4.3, 1.4.6, 1.4.11). L'alpha du premier plan est composé sur l'arrière-plan avant le ratio. Plafond matrice : 16 couleurs par axe. Une 17e couleur affiche une erreur, jamais une troncature silencieuse. APCA utilise l'implémentation indépendante de color.js, pas le paquet npm apca-w3. L'URL partageable sert à l'état de l'espace de travail. Les boutons de partage sur les réseaux sont séparés.

Options

  • Superposition APCA (bêta) — Affiche APCA Lc dans une section séparée et étiquetée. Désactivé par défaut. N'implique jamais la conformité WCAG 3.
  • Taille et graisse du texte — Définit les seuils WCAG grand texte et l'aperçu d'exemple. Par défaut 20px / 400 (texte normal).
  • Alpha du premier plan — Compose le premier plan sur l'arrière-plan avant de calculer le ratio. Par défaut 1 (opaque).
  • Filtre de conformité matrice — Affiche ou masque les cellules AAA, AA, AA grand et échec sur la matrice. Masqué en vue paire unique.

Outils CSS associés

Hub : Outils couleur & CSS. Réduisez ou formatez vos feuilles de style avec Minifier CSS et Beautifier CSS.

FAQ du vérificateur de contraste WCAG

Vérificateur local centré sur WCAG

APCA est-il identique à WCAG 3 ?

Non. APCA est une superposition bêta optionnelle dans une section séparée. WCAG 2.2 AA/AAA reste la référence de conformité sur cette page.

Mes couleurs sont-elles envoyées ?

Non. L'analyse et le calcul de contraste s'exécutent entièrement dans votre navigateur. FastMinify n'envoie jamais les couleurs à un serveur.

Quels formats de collage sont acceptés ?

HEX, RGB, HSL, OKLCH, color() CSS (display-p3 inclus) et couleurs CSS nommées. Aucune bascule de format n'est nécessaire.

Combien de couleurs en matrice sont autorisées ?

Jusqu'à 16 par axe (256 cellules max). Au-delà, la saisie échoue avec une erreur visible.

Vérification de contraste WCAG en collage local avec syntaxe couleur CSS moderne — vues paire et matrice, jamais envoyé.