Convertisseur de couleurs et contraste
Convertissez une couleur d'un format à l'autre, et vérifiez que le contraste entre votre texte et son fond respecte les règles d'accessibilité.
Tout se calcule dans votre navigateur. Rien n'est envoyé, enregistré ni conservé sur un serveur.
Couleur du texte
Couleur du fond
La couleur du texte, dans tous les formats
- Hexadécimal
#5aa9ff - RGB
rgb(90, 169, 255) - HSL
hsl(211, 100%, 68%) - RGB sans fonction
90 169 255
Contraste et accessibilité
Un grand titre, tel qu'il apparaîtra
Et un paragraphe de texte courant, dans la taille où vos visiteurs le liront réellement sur votre site.
7,80:1
Rapport de contraste
Conforme
AA — texte courant
Conforme
AA — grand texte et interface
| Critère | Exigence | Résultat |
|---|---|---|
| AA — texte courant | 4,5:1 | Conforme |
| AA — grand texte et interface | 3:1 | Conforme |
| AAA — texte courant | 7:1 | Conforme |
| AAA — grand texte | 4,5:1 | Conforme |
Grand texte : au moins 24 px, ou 19 px en gras. En dessous du niveau AA, une partie de vos visiteurs ne peut simplement pas lire le texte.
Convertisseur de couleurs : à quoi ça sert ?
Une même couleur s'écrit de trois façons : en hexadécimal (#5aa9ff), en composantes rouge-vert-bleu, ou en teinte-saturation-luminosité. Le format HSL est le plus commode pour éclaircir ou assombrir une teinte sans la dénaturer.
Le calcul de contraste applique la formule officielle des règles WCAG 2.1. En dessous de 4,5 pour 1, un texte de taille normale est illisible pour une partie de vos visiteurs — et cela vous est reproché aussi bien par un audit d'accessibilité que par vos clients.
Vos questions
Convertisseur de couleurs — questions fréquentes
Quel contraste faut-il atteindre ?
4,5 pour 1 pour un texte courant, 3 pour 1 pour un grand titre ou un élément d'interface. Le niveau AAA, plus exigeant, demande 7 pour 1.
Pourquoi le contraste compte-t-il autant ?
Parce qu'un texte gris clair sur fond blanc est illisible pour une personne malvoyante, pour un daltonien, et pour n'importe qui consultant son téléphone en plein soleil. C'est le défaut d'accessibilité le plus répandu sur le web.
Dans la même boîte
Ces outils vous sont utiles ? Un site l'est encore plus.
Je les ai construits pour mon propre travail et je les partage gratuitement. Si votre activité a besoin d'un site, d'une boutique ou d'un outil sur mesure, parlons-en : le premier échange ne coûte rien.