Matrice de contraste d’une palette
Collez jusqu’à dix couleurs. Toutes les paires de texte et de fond apparaissent à la fois, avec leur rapport et leur verdict.
- Toutes les paires
- Jusqu’à dix couleurs
- AA et AAA
Jusqu’à dix couleurs, une par ligne ou séparées par des virgules.
10 paires sur 30 passent AA pour le texte courant
Fonctionne entièrement dans votre navigateur. Rien de ce que vous entrez n’est envoyé ni conservé.
Pourquoi vérifier une palette plutôt qu’une paire
Une palette de six couleurs donne trente paires de texte et de fond. Les vérifier une à une en laisse filer la plupart, et celles qui échouent sont rarement celles auxquelles on pensait. La matrice les montre toutes : chaque ligne est une couleur de texte, chaque colonne un fond, chaque case le contraste entre les deux.
Lire la matrice
- AAA : 7:1 et plus, convient à tout texte.
- AA : 4,5:1 et plus, le niveau qu’exigent la plupart des lois pour le texte courant.
- AA grand : 3:1 et plus, pour le grand texte (24 px, ou 18,66 px en gras) et les composants d’interface.
- Échec : sous 3:1, pour la décoration seulement.
Une couleur sur elle-même est écartée : la diagonale reste vide.
De la matrice au design
Servez-vous de la matrice pour nommer les paires qu’un design peut employer, puis tenez-vous-y : un guide de style qui liste ses couleurs de texte approuvées pour chaque fond reste accessible en grandissant. Pour corriger une paire qui échoue, portez-la au vérificateur de contraste, qui trouve la couleur conforme la plus proche.
Fait par Mystya.
Nous sommes un studio web du Québec. Ces outils sont gratuits et le resteront : c’est notre façon de montrer ce à quoi nous tenons, dans quelque chose qui sert. Si vous voulez un site construit avec la même attention, parlons-en.