A11y Colors Check A11y Colors Check

Vérifiez le Contraste des Couleurs WCAG et Générez des Palettes Accessibles

Sélecteur de Couleurs

Aperçu en Direct

Exemple de Texte d'En-tête

Le rapide renard brun saute par-dessus le chien paresseux

Ratio de Contraste

0:1
1:1 21:1
Conformité WCAG
AA
AAA
Texte Normal
-
-
Grand Texte
-
-

Échantillons de Texte

Normal
Le rapide renard brun saute par-dessus le chien paresseux
16px
Grand
Le rapide renard brun saute par-dessus le chien paresseux
24px
Gras
Le rapide renard brun saute par-dessus le chien paresseux
16px

Palette de Couleurs

Exporter CSS

Pourquoi l'Accessibilité est-elle importante?

Pourquoi l'Accessibilité est-elle importante?

En intégrant l'accessibilité à votre flux de conception Web, vous améliorerez la convivialité de votre site Web et vos utilisateurs bénéficieront d'une meilleure expérience, ce qui pourra entraîner l'élargissement de votre audience, vos utilisateurs seront vos ambassadeurs et cela pourra conduire à une augmentation de votre trafic. Plus que des aspects juridiques, notre objectif est de favoriser l'accessibilité et l'inclusivité pour tous, et de vous aider à rendre la conception de votre site Web consciente et conforme.

Ces directives sont basées sur les normes (niveaux A et AA) des Web Content Accessibility Guidelines (WCAG) (lien externe), et vous disposez ici d'un moyen de vérifier la conformité jusqu'aux exigences du plus haut niveau AAA.

Qu'est-ce que le Contraste des Couleurs?

Qu'est-ce que le Contraste des Couleurs?

Le contraste des couleurs est la différence de luminosité entre les couleurs de premier plan et d'arrière-plan. Il est mesuré comme un rapport de 1:1 (aucun contraste) à 21:1 (contraste maximum).

Un contraste plus élevé rend le texte plus facile à lire, en particulier pour les utilisateurs ayant une déficience visuelle.

Pourquoi le Contraste est-il important?

Pourquoi le Contraste est-il important?

Un contraste de couleur approprié garantit que tout le monde peut lire votre contenu, y compris les personnes malvoyantes, daltoniennes ou qui consultent du contenu en plein soleil.

Les WCAG exigent des rapports de contraste minimaux: 4.5:1 pour le texte normal (niveau AA) et 7:1 pour une accessibilité améliorée (niveau AAA).

Pourquoi les Tailles de Texte sont-elles importantes?

Pourquoi les Tailles de Texte sont-elles importantes?

Un texte plus grand est plus facile à lire et nécessite moins de contraste. Les WCAG définissent le "grand texte" comme 18pt (24px) ou plus grand pour le poids régulier, et 14pt (18.5px) ou plus grand pour le texte en gras.

Le grand texte ne nécessite qu'un rapport de contraste de 3:1 pour la conformité AA, contre 4.5:1 pour le texte normal.