Grille de contraste
Grille WCAG de ratios de contraste pour toutes les combinaisons de couleurs — style Eightshapes
À propos de Grille de contraste
Générez une grille de ratios de contraste WCAG pour toutes vos combinaisons de couleurs — vérifiez l'accessibilité en un coup d'œil, style Eightshapes.
Comment utiliser Grille de contraste
- 1Ajoutez des couleurs à votre palette avec des valeurs HEX et des labels optionnels.
- 2La grille génère automatiquement les ratios de contraste pour chaque combinaison avant-plan/arrière-plan.
- 3Vérifiez quelles paires respectent les niveaux WCAG AA ou AAA et lesquelles échouent.
- 4Filtrez la grille pour afficher toutes les combinaisons, les réussies uniquement ou les échouées.
- 5Exportez la grille complète en CSV pour la documentation ou la revue d'équipe.
Astuces
- Commencez par vos couleurs de marque et neutres pour identifier rapidement les paires texte/fond accessibles.
- WCAG AA exige un ratio minimum de 4.5:1 pour le texte normal et 3:1 pour le texte large.
- Exportez le CSV et intégrez-le dans la documentation de votre design system pour référence développeur.
Limites free / payant
Gratuit : nombre limité de couleurs. Starter+ : couleurs illimitées dans la palette.
Outils similaires
Équipe OneKitToolsMise à jour 2.21.4