Tiny Online Tools logoTiny Online ToolssearchRechercher des outils…grid_viewTous les outils
Accueilchevron_rightOutils de Designchevron_rightVérificateur de Contraste de CouleurVérificateur de Contraste de Couleur

Vérificateur de Contraste de Couleur

Vérifiez les ratios de contraste WCAG 2.1 pour l'accessibilité.

#1e1b4b#ffffff

Sample Heading Text

The quick brown fox jumps over the lazy dog. This is body text at 16px to demonstrate readability at normal size.

15.99:1
Contrast Ratio
Résultats WCAG 2.1
check_circle
AA Normal Text
Min 4.5:1Body text, UI components
RÉUSSI
check_circle
AA Large Text
Min 3:118pt+ or 14pt+ bold
RÉUSSI
check_circle
AAA Normal Text
Min 7:1Enhanced: body text
RÉUSSI
check_circle
AAA Large Text
Min 4.5:1Enhanced: large text
RÉUSSI

Outils similaires

Convertir un PDF en niveaux de gris

Convertir un PDF en niveaux de gris

Convertissez un PDF couleur en niveaux de gris en rendant chaque page puis en reconstruisant le document.

Pipette de Couleur d'Image

Pipette de Couleur d'Image

Sélectionnez des codes couleur depuis n'importe quelle image.

Convertisseur de Codes Couleur

Convertisseur de Codes Couleur

Convertissez les codes couleur HEX, RGB et HSL.

Générateur de Couleurs Aléatoires

Générateur de Couleurs Aléatoires

Générez des palettes de couleurs aléatoires avec des règles d'harmonie.

Cron analyseur

Cron analyseur

Parse et valider Cron expressions avec plain-English descriptions.

Image en Base64

Image en Base64

Convertissez des fichiers image en chaînes encodées en Base64.

Image en Art ASCII

Image en Art ASCII

Convertissez des images en art ASCII par mappage de luminosité dans votre navigateur.

apps

Plus d'outils

Parcourez notre collection complète d'outils en ligne gratuits.

Vérifiez le contraste avant d'envoyer vos couleurs en production

Une palette peut être élégante tout en restant insuffisante pour l'accessibilité. Ce vérificateur vous aide à tester les combinaisons de texte et d'arrière-plan par rapport aux seuils WCAG afin de détecter les problèmes avant qu'ils n'arrivent dans un design system, une bibliothèque de composants ou un produit en ligne.

Ce que les résultats indiquent

L'outil affiche le ratio de contraste ainsi que la réussite ou l'échec pour les niveaux WCAG les plus courants :

  • texte normal en AA
  • grand texte en AA
  • texte normal en AAA
  • grand texte en AAA

Pourquoi c'est utile en pratique

Le contrôle du contraste est important pour :

  • valider des couleurs de marque dans des composants
  • tester du texte sur des boutons, cartes ou bannières
  • vérifier l'accessibilité pendant la phase de handoff
  • éviter des combinaisons difficiles à lire pour les personnes malvoyantes

Un résultat conforme ne suffit pas toujours

Une combinaison peut passer techniquement tout en restant inconfortable avec une petite taille de texte ou une graisse légère. Après validation, prenez quand même le temps d'observer l'aperçu avec des tailles de texte réalistes.