Sélecteur de couleur et vérificateur de contraste

Comment utiliser le Sélecteur de couleur et vérificateur de contraste

Ce qu’il calcule et quand l’utiliser

Choisit et convertit des couleurs entre HEX, RGB, HSL, HSV et CMJN, propose teintes, nuances et couleurs assorties, et vérifie le contraste du texte selon les règles d’accessibilité WCAG.

Mode d’emploi, étape par étape

1. Choisissez une couleur avec le sélecteur ou saisissez-la en HEX, RGB, HSL ou par son nom.
2. Choisissez une couleur de fond pour vérifier le contraste.
3. Copiez n’importe quel format en un clic.
4. Utilisez les teintes, nuances et couleurs assorties pour une palette.

Que signifie chaque champ

• Couleur – #2443C8 par défaut, le bleu SmartCalcy.
• Fond – Blanc par défaut.

Comment lire les résultats

• Rapport de contraste – De 1:1 à 21:1, avec les résultats AA et AAA pour le texte normal et le grand texte.
• Formats – HEX, RGB, HSL, HSV et CMJN.
• Teintes et nuances – Versions plus claires et plus foncées.
• Couleurs assorties – Complémentaires, analogues et en triade.

La formule

Rapport de contraste = (L1 + 0,05) ÷ (L2 + 0,05), où L1 et L2 sont les luminances relatives de la couleur la plus claire et de la plus foncée. Le niveau WCAG AA exige 4,5:1 pour le texte normal et 3:1 pour le grand texte ; AAA exige 7:1 et 4,5:1.

Un exemple concret

Avec les couleurs de départ, #2443C8 sur blanc a un rapport de contraste de 7,74:1, conforme AAA pour toutes les tailles de texte.

Hypothèses et limites

• Les valeurs CMJN sont une conversion simple, pas un profil d’impression avec gestion des couleurs.
• Les résultats de contraste suivent la formule WCAG 2.

Erreurs courantes

• Vérifier le contraste uniquement sur du grand texte puis utiliser la couleur pour du petit texte.
• Compter uniquement sur la couleur pour transmettre une information.

Questions fréquentes

Outils associés