Frontend et mobile

Outils couleur et accessibilité

Ces outils aident à choisir et vérifier des couleurs pour une interface accessible : convertir entre HEX, RGB, HSL, HSV, CMJN, Lab et OKLCH, générer des palettes cohérentes, vérifier le contraste d'une paire de couleurs, et simuler quatre formes de daltonisme sur une couleur ou une image entière avant de valider un design.

Le convertisseur de couleurs signale les valeurs qui sortent du gamut sRGB lorsqu'on manipule Lab ou OKLCH, un problème facile à manquer à l'œil. Le vérificateur de contraste applique les normes WCAG classiques, tandis que le calculateur de contraste APCA propose le modèle plus récent, pensé pour mieux refléter la perception réelle. Toutes ces vérifications se font dans le navigateur.

5 outils

FAQ des outils Color & Accessibility

Quelle est la différence entre le contraste WCAG et le contraste APCA ?

WCAG 2 calcule un ratio de contraste unique entre deux couleurs, tandis qu'APCA tient compte de la taille et de l'épaisseur du texte pour mieux refléter la lisibilité perçue. Le vérificateur de contraste couvre WCAG, le calculateur de contraste APCA couvre le second modèle.

Comment savoir si une couleur OKLCH sort du gamut sRGB ?

Le convertisseur de couleurs signale explicitement quand une valeur Lab ou OKLCH donnée ne peut pas être représentée fidèlement en sRGB, ce qui évite d'obtenir une couleur écrasée ou décalée une fois affichée sur un écran classique.

Comment simuler le daltonisme sur une image avant de publier un design ?

Le simulateur de daltonisme applique quatre formes courantes de vision des couleurs à une image ou à une palette, ce qui permet de vérifier qu'une information codée uniquement par la couleur reste distinguable pour ces utilisateurs.