Verifiez la conformite WCAG AA et AAA de vos combinaisons de couleurs. Calculez le ratio de contraste et testez l'accessibilite de votre texte. 100% gratuit et sans inscription.
Grand texte (18px+)
Texte normal — Lorem ipsum dolor sit amet, consectetur adipiscing elit. Verifiez la lisibilite de votre combinaison de couleurs.
17.06:1
Ratio de contraste
Niveau
Texte normal
Grand texte (18px+)
WCAG AA
Valide
Valide
WCAG AAA
Valide
Valide
AA requis : 4.5:1 normal / 3:1 grand — AAA requis : 7:1 normal / 4.5:1 grand
Pourquoi verifier le contraste de vos couleurs ?
L'accessibilite web n'est pas seulement une bonne pratique : c'est une obligation legale pour
de nombreux acteurs (services publics, grandes entreprises) et un facteur de qualite pour tous.
Les normes WCAG (Web Content Accessibility Guidelines) definissent des ratios de contraste minimum
pour garantir que le contenu est lisible par le plus grand nombre.
Notre calculateur utilise la formule officielle de luminance relative du W3C pour calculer le ratio
exact entre vos couleurs de texte et de fond, et vous indique si vous etes conformes aux niveaux
AA et AAA pour le texte normal et le grand texte.
Fonctionnalites
Calcul precis — Utilise la formule de luminance relative officielle du W3C.
Double conformite — Verification simultanee WCAG AA et AAA pour texte normal et grand texte.
Apercu live — Visualisez vos couleurs en situation reelle avec du vrai texte.
Selecteur de couleur — Entrez en HEX ou utilisez le color picker natif du navigateur.
Inversion rapide — Echangez texte et fond en un clic pour tester les deux sens.
Export du rapport — Copiez les resultats pour votre documentation d'accessibilite.
Questions frequentes
Qu'est-ce que le ratio de contraste WCAG ?
Le ratio de contraste WCAG mesure la difference de luminosite entre deux couleurs. Il va de 1:1 (identique) a 21:1 (noir sur blanc). Les normes WCAG 2.1 exigent un minimum de 4.5:1 pour le texte normal (AA) et 7:1 pour le niveau AAA. Pour le grand texte (18px+ ou 14px+ en gras), les seuils sont abaisses a 3:1 et 4.5:1.
Quelle est la difference entre WCAG AA et AAA ?
WCAG AA est le niveau de conformite minimal recommande pour la majorite des sites. WCAG AAA est le niveau le plus exigeant, requis pour les services publics et certains contextes legaux. AA garantit une lisibilite correcte pour la plupart des utilisateurs, y compris ceux souffrant de deficiences visuelles moderees.
Comment corriger un contraste insuffisant ?
Pour augmenter le contraste, assombrissez la couleur du texte ou eclaircissez la couleur de fond (ou les deux). En HSL, reduisez la luminosite du texte ou augmentez-la pour le fond. Des combinaisons comme noir sur blanc, blanc sur bleu fonce, ou texte sombre sur fond clair passent facilement les criteres WCAG.
Pourquoi l'accessibilite des couleurs est-elle importante ?
Environ 8% des hommes et 0.5% des femmes souffrent de daltonisme. De nombreuses autres personnes ont des deficiences visuelles partielles. Un contraste suffisant beneficie aussi aux utilisateurs en plein soleil, sur des ecrans de faible qualite, ou simplement en vieillissant. C'est une exigence legale pour les services publics en France.
Le ratio de contraste s'applique-t-il aux images et icones ?
Oui, les elements graphiques porteurs d'information (icones, graphiques, boutons iconiques) doivent aussi respecter un ratio de 3:1 contre leur environnement (WCAG 1.4.11). Ce calculateur se concentre sur le contraste texte/fond, mais le principe s'applique a tous les elements visuels fonctionnels.
Chaque semaine, le meilleur de la tech francaise
Tendances, salaires, outils et opportunites — directement dans votre boite mail.
