1000 Outils

Générateur de palette accessible

Créez une palette de couleurs complété pour votre interface utilisateur à partir d'une seule couleur primaire, avec la garantie d'un contraste suffisant pour l'accessibilité. Notre outil généré automatiquement 8 couleurs (primaire, secondaire, accent, arriere-plan, texte, succès, erreur, avertissement) et vérifié les ratios de contraste WCAG AA entre chaque paire pertinente.

Palette generee

Primaire

Couleur principale, boutons, liens

Secondaire

Elements secondaires, badges

Accent

Mise en avant, appels a l'action

Arriere-plan

Fond de page

Texte

Texte principal

Succes

Messages de succes, validation

Erreur

Messages d'erreur, alertes

Avertissement

Messages d'avertissement

Verification du contraste WCAG

Texte sur arriere-plan
15.8:1 AAA
Primaire sur arriere-plan
3.4:1 Insuffisant
Texte sur primaire
3.7:1 Insuffisant

Apercu

Titre de la page

Ceci est un exemple de texte utilisant les couleurs de votre palette.

SuccesErreurAvertissement

L'accessibilité des couleurs : une obligation legale et ethique

Les normes WCAG (Web Content Accèssibility Guidelines) définissent des ratios de contraste minimaux pour garantir la lisibilité du contenu web par tous, y compris les personnes malvoyantes ou daltoniennes. Le niveau AA exige un ratio d'au moins 4.5:1 pour le texte normal et 3:1 pour le texte large (18px+ ou 14px+ gras). Le niveau AAA (plus strict) exige 7:1 et 4.5:1 respectivement. En France, le RGAA impose le respect de ces normes pour les sites publics.

Comment notre générateur garantit l'accessibilité

A partir de votre couleur primaire, notre algorithme généré des couleurs complémentaires en ajustant la teinte, la saturation et la luminosité. Pour chaque couleur générée, le ratio de contraste est calcule avec les couleurs d'arriere-plan et de texte selon la formule W3C (luminance relative). Si un ratio est insuffisant, la couleur est automatiquement ajustee pour atteindre le seuil WCAG AA. Le résultat est une palette complété et harmonieuse, utilisable en toute confiance.

Comprendre le ratio de contraste

Le ratio de contraste mesure la différence de luminosité entre deux couleurs sur une échelle de 1:1 (identique) à 21:1 (noir sur blanc). Il est calcule à partir de la luminance relative des deux couleurs. Un texte noir (#000000) sur fond blanc (#FFFFFF) à un ratio de 21:1, tandis qu'un gris moyen sur blanc peut descendre à 2:1, rendant le texte très difficile à lire. Notre outil affiche le ratio exact pour chaque paire de couleurs et indique si le niveau AA ou AAA est atteint.

Questions fréquentes

Outils similaires