Puffinmint
FR
Italiano English Español Français Deutsch Português (Brasil) 日本語 한국어 Polski Türkçe

Test du contraste des couleurs WCAG

Comparez texte et fond, calculez leur rapport de contraste et vérifiez les seuils WCAG AA et AAA pour les tailles de texte normales et grandes.

Traitement dans le navigateur : aucune donnée envoyée.

Configurez vos données

Configurez vos données

Choisissez les couleurs opaques du texte et du fond. Rapport calculé par luminance relative sRGB, comparé aux seuils AA et AAA.

Résultat

Le résultat apparaîtra ici.

Nous comptons les outils les plus utilisés, sans inclure les valeurs saisies ni le contenu des fichiers dans les statistiques. Confidentialité

Comment utiliser l’outil

  1. Choisissez les couleurs opaques du texte et du fond.
  2. Rapport calculé par luminance relative sRGB, comparé aux seuils AA et AAA.

Méthode et principes

Couleurs sRGB opaques ; grand texte : 18 pt ou 14 pt gras.

Contraste textuel WCAG 2.2 uniquement.

Exemple pratique

Données saisies
  • Couleur du texte: #000000
  • Couleur de fond: #ffffff
Résultat
21:1 AA texte normal: Conforme AA grand texte: Conforme AAA texte normal: Conforme AAA grand texte: Conforme

Sources et informations complémentaires

GUIDES PRATIQUES

Vérifier le contraste du texte sans fausser le seuil

Deux couleurs différentes peuvent produire un texte difficile à lire. Mesurez la paire réelle, puis examinez taille du texte, composition du fond et états de l’interface.

Suivre les étapes

Ces outils pourraient aussi vous servir

Tout voir

Générateur de favicon

Créez des favicons à partir d’une image, de texte ou d’un emoji. Prévisualisez et téléchargez plusieurs tailles PNG et un fichier ICO.

Générateur de palette de couleurs

Créez des palettes analogues, complémentaires, triadiques ou monochromes. Copiez les codes HEX et téléchargez les variables CSS.

Générateur de dégradé CSS

Créez un dégradé CSS linéaire ou radial avec deux couleurs, un angle et un aperçu. Copiez le code ou téléchargez le CSS.

Favoris