Vérificateur de contraste chromatique
Évaluation immédiate du rapport de contraste entre la couleur du texte et la couleur de fond, ainsi que de la conformité aux normes de lisibilité (WCAG AA)
Caractéristiques
Évaluation instantanée du rapport de contraste
Affiche la conformité WCAG AA en entrant simplement la couleur du texte et la couleur de fond
Compatible avec sélecteur et code
Spécifiez avec un sélecteur de couleur ou collez des codes HEX, format court ou rgb()
Affichage d'exemple en 2 tailles
Vérifiez l'apparence réelle du texte normal et des en-têtes instantanément
Appliquer les couleurs conformes en un clic
Appliquez immédiatement les suggestions de couleur avec luminosité ajustée tout en préservant la teinte
Guide d'utilisation
Spécifiez la couleur du texte
Sélectionnez avec le sélecteur de couleur ou entrez un code couleur au format #333333, #333 ou rgb(51, 51, 51)
Spécifiez la couleur de fond
Spécifiez la couleur de fond de la même manière. Les résultats se mettent à jour au fur et à mesure sans appuyer sur un bouton
Vérifiez le rapport, la conformité et l'exemple
Confirmez le rapport de contraste, la conformité du texte normal et du texte grand, l'évaluation synthétique et l'apparence du texte d'exemple
Appliquez la suggestion et revérifiez
Si non conforme, appliquez une couleur conforme avec le bouton de suggestion tel que « Changer la couleur du texte en… ». Vous pouvez également échanger la couleur du texte et la couleur de fond avec le bouton d'échange
Cas d'usage
Vérifier les couleurs des diapositives et des documents
Vérifiez avant la création si les couleurs du texte et du fond des documents internes ou des diapositives sont lisibles
Vérification des couleurs du site Web
Vérifiez si les couleurs du site ou des bannières respectent les normes d'accessibilité (WCAG AA)
Évaluer l'utilisation de la couleur de marque dans le corps du texte
Déterminez à quel point la couleur de marque doit être foncée pour être utilisée comme couleur de texte
Corriger les couleurs non conformes
Corrigez les couleurs signalées en les changeant en couleurs conformes tout en préservant la teinte
Connaissances de base
Qu'est-ce que le rapport de contraste ?
Le rapport de contraste est un indice numérique de 1:1 à 21:1 qui exprime la différence de luminosité entre la couleur du texte et la couleur de fond. La combinaison noir et blanc atteint le maximum de 21:1, et les couleurs identiques atteignent le minimum de 1:1.
- Comment fonctionne le calcul：Le rapport de contraste est calculé en convertissant deux couleurs en luminance relative sRGB, puis en divisant par la luminance de la plus claire plus 0,05 et la luminance de la plus sombre plus 0,05.
- Repères numériques：Pour un fond blanc (#FFFFFF), le gris #777777 a un rapport de contraste de 4,47:1, #999999 de 2,84:1, et le noir (#000000) de 21:1.
Différence entre AA et AAA du WCAG
WCAG est une ligne directrice internationale sur l'accessibilité du contenu Web, définissant les seuils de conformité des rapports de contraste en deux niveaux : AA et AAA.
- AA (niveau standard)：AA est le critère qui demande 4,5:1 ou plus pour le texte normal et 3,0:1 ou plus pour le texte grand, et c'est le niveau que les sites Web généraux cherchent à atteindre.
- AAA (niveau plus strict)：AAA est le critère qui demande 7:1 ou plus pour le texte normal et 4,5:1 ou plus pour le texte grand, et c'est le niveau qui vise à être lisible même pour les personnes ayant une basse vision.
Définition du texte large
Le texte grand du WCAG désigne un texte d'environ 18 points (24px) ou plus, ou de 14 points (environ 18,7px) ou plus en gras.
- Texte normal：Le texte normal est d'une taille non comprise dans la catégorie du texte grand, comme le corps du texte ou les notes, et nécessite un rapport de contraste d'au moins 4,5:1.
- Relation avec les en-têtes：Même pour les en-têtes, s'ils font moins de 24px et ne sont pas en gras, ils sont traités comme du texte normal, donc la vérification à la fois de la taille et de l'épaisseur est nécessaire.
Sécurité et confidentialité
Tout dans le navigateur
Les données saisies sont traitées uniquement dans votre navigateur et ne sont pas envoyées à l'extérieur.
Traitement dans le navigateur uniquement
Calcul du rapport de contraste et suggestions de couleurs s'effectue entièrement dans votre navigateur et les données saisies ne sont pas envoyées aux serveurs.
Communication chiffrée via HTTPS
Le chargement de la page est également chiffré par TLS et son contenu ne peut être consulté par des tiers.
Aucune transmission à des tiers
Les données saisies ne sont pas transmises à des services externes tels que les réseaux publicitaires ou les suivi.
Aucune sauvegarde automatique des résultats
Couleur du texte et couleur de fond entrées et les suggestions de saisie ne sont pas stockés sur le serveur.
Suivez RAKKOTOOLS sur Google Search
194 outils pratiques deviennent plus faciles à découvrir via Google Search et la recherche IA !
- Découvrable en recherche
- Affiché aussi en recherche IA
- Découvrez les nouveaux outils
Mises à jour
- update #337
Vérificateur de contraste de couleur ajouté, évaluation de la lisibilité des couleurs de texte et de fond