Matrice de contraste des couleurs

Cette matrice calcule la luminance relative WCAG 2 de chaque couleur hexadécimale fournie, compare toutes les couleurs entre elles et renvoie les résultats dans une matrice carrée stable. Les designers, développeurs et spécialistes de l’accessibilité peuvent examiner en une fois toute la palette d’un système de conception, au lieu de tester chaque paire séparément. Les entrées sont validées, les couleurs normalisées et le résultat déterministe convient aux audits automatisés comme aux rapports versionnés.

Lisez la matrice sans perdre le repère des couleurs

Envoyez une liste de deux à cent couleurs hexadécimales. Les formes à trois ou six chiffres sont acceptées, avec ou sans dièse initial, et chaque valeur valide est normalisée en code à six chiffres minuscules. La réponse conserve l’ordre des couleurs et attribue un indice à chacune. Les lignes et colonnes suivent exactement cet ordre : la valeur de la deuxième ligne et de la cinquième colonne décrit donc le contraste entre les couleurs d’indices deux et cinq. La diagonale vaut toujours 1, puisqu’une couleur ne contraste pas avec elle-même, et la matrice est symétrique, car inverser le premier plan et l’arrière-plan ne change pas le rapport WCAG. Chaque rapport affiché est arrondi à deux décimales et chaque luminance à six. Les doublons restent des positions distinctes, ce qui facilite l’audit de jetons partageant une valeur mais remplissant des rôles sémantiques différents. Cette organisation permet d’afficher facilement un tableau, de conserver une preuve d’audit ou de comparer des versions.

Comprenez le calcul et les seuils WCAG

Le calcul suit la méthode de luminance relative WCAG 2 pour les couleurs sRGB. Chaque canal rouge, vert et bleu est converti de sa valeur sRGB encodée en lumière linéaire, puis combiné avec les coefficients standard. Pour chaque paire, la luminance la plus claire augmentée de 0.05 est divisée par la plus sombre augmentée de 0.05, ce qui donne un rapport de 1 à 21. La réponse rappelle les seuils WCAG : 4.5 pour le texte normal AA, 7 pour le texte normal AAA, 3 pour le grand texte AA et 4.5 pour le grand texte AAA. Comparez chaque cellule au seuil adapté au contenu et à la typographie réels. Un rapport ne suffit pas à déclarer toute une interface accessible : la taille et la graisse de police, les états interactifs, les éléments non textuels et le contexte comptent aussi. L’outil fournit donc des preuves numériques plutôt qu’un verdict global, afin que votre audit applique la bonne règle à chaque association prévue sans confondre une valeur arrondie avec une garantie générale.

Exploitez un résultat déterministe dans vos audits

Une matrice complète est particulièrement utile lorsque le contrôle de palette doit être reproductible. Conservez un ordre documenté, par exemple les tons neutres puis les jetons de marque, d’état et d’accent, et archivez la matrice avec la version du système de conception. Un contrôle d’intégration continue peut comparer certaines cellules aux seuils requis, tandis qu’une personne chargée de la revue parcourt le tableau complet pour repérer des associations faibles inattendues. Comme l’algorithme n’utilise ni réseau, ni hasard, ni heure courante, ni style du navigateur, ni estimation de profil colorimétrique, une entrée JSON identique produit une sortie JSON identique. Les listes invalides, les palettes hors limites et les codes hexadécimaux incorrects sont refusés avec un indice explicite. La limite de cent couleurs borne la matrice quadratique à dix mille cellules. Gérez transparence et composition avant l’appel : les couleurs alpha sont refusées, car leur rendu dépend du fond. Convertissez aussi noms, HSL, valeurs à gamut étendu et objets d’outils de conception en hex sRGB opaque pour obtenir une base explicite et reproductible.