Outil gratuit
Palette couleurs WCAG.
Generez une palette accessible respectant WCAG 2.1 AA depuis une seule couleur. Verifie le contraste sur fond clair et sombre. Variables CSS pretes a copier.
Couleur de base
Hex format (ex: #00d4c8). On genere automatiquement les variantes.
Tester un contraste manuel
Ratio 21.0:1
AA texte normal (4.5:1)PASS
AA grand texte (3:1)PASS
AAA texte normal (7:1)PASS
AAA grand texte (4.5:1)PASS
Palette generee
Cliquez sur une nuance pour copier sa valeur hex.
Fond clair
Texte normal — voici un exemple de paragraphe pour verifier la lisibilite.
Grand texte / titre
Fond sombre
Texte normal — voici un exemple de paragraphe pour verifier la lisibilite.
Grand texte / titre
Variables CSS
Charte graphique complete ?
On cree votre identite visuelle complete : palette, typos, logos, supports. →
Questions frequentes.
C'est quoi WCAG et pourquoi c'est important ? +
WCAG = Web Content Accessibility Guidelines. C'est le standard mondial d'accessibilite numerique. Niveau AA = minimum legal en UE depuis le European Accessibility Act (juin 2025). Ratio de contraste minimum : 4.5:1 pour le texte normal, 3:1 pour le grand texte (18pt+).
Mon site sera-t-il vraiment poursuivi pour mauvais contraste ? +
En Belgique, depuis juin 2025, les sites ecommerce et services prives doivent respecter WCAG 2.1 AA. Sanctions possibles : amendes jusqu'a 60 000 € + retrait du marche. Au-dela : un client qui ne peut pas lire votre texte = client perdu, point.
Comment generer une palette accessible from scratch ? +
Choisissez une couleur primaire (ex : votre teal de marque). L'outil genere automatiquement les variantes (claire, foncee, hover) ET verifie que chaque variante respecte le contraste sur fond clair ET fond sombre.
Comment integrer cette palette a mon site ? +
Copiez les variables CSS (--color-primary, --color-primary-dark, etc.) dans votre :root. Compatibles Tailwind, vanilla CSS, ou n'importe quel framework.