Vérifiez le contraste, obtenez des suggestions conformes WCAG et RGAA en temps réel.
Voici un paragraphe d'exemple pour visualiser le rendu de vos couleurs. Le texte doit rester lisible sur ce fond, même en petite taille.
Texte en petite taille (12px) — vérifiez la lisibilité.
Un lien d'exempleTexte d'exemple
Texte d'exemple
Texte d'exemple
Réponse sous 24h — Sans engagement
Le contraste entre le texte et l'arrière-plan est l'un des piliers de l'accessibilité web. Près de 300 millions de personnes dans le monde vivent avec une déficience visuelle, et un contraste insuffisant rend le contenu illisible pour une large partie d'entre elles. Au-delà du handicap, un bon contraste bénéficie à tous : sur un écran en plein soleil, dans un environnement sombre, ou simplement avec la fatigue oculaire après des heures de travail.
Les WCAG 2.1 (Web Content Accessibility Guidelines) définissent deux niveaux de conformité pour le contraste :
En France, le RGAA (Référentiel Général d'Amélioration de l'Accessibilité) est obligatoire pour les sites publics et les entreprises réalisant plus de 250 millions d'euros de chiffre d'affaires. Le critère 3.2 du RGAA reprend directement les seuils de contraste du WCAG.
La méthode la plus simple consiste à ajuster la luminosité (L dans le modèle HSL) de la couleur du texte ou du fond. Assombrir le texte ou éclaircir le fond améliore le ratio sans changer la teinte ni la saturation de votre charte graphique. Notre outil calcule automatiquement la couleur conforme la plus proche.
Pensez aussi à tester vos couleurs en simulation daltonisme. Environ 8 % des hommes sont daltoniens (protanopie, deutéranopie). Un contraste qui passe les tests WCAG peut rester problématique pour un utilisateur daltonien si les couleurs deviennent indistinguables.
Pour aller plus loin, découvrez notre estimateur de prix site internet ou consultez nos tarifs développeur freelance.
The contrast between text and background is one of the pillars of web accessibility. Nearly 300 million people worldwide live with a visual impairment, and insufficient contrast makes content unreadable for a large portion of them. Beyond disability, good contrast benefits everyone: on a screen in direct sunlight, in a dark environment, or simply when dealing with eye fatigue after hours of work.
WCAG 2.1 (Web Content Accessibility Guidelines) defines two levels of contrast compliance:
In France, the RGAA (Référentiel Général d'Amélioration de l'Accessibilité) is mandatory for public websites and companies with over 250 million euros in revenue. RGAA criterion 3.2 directly mirrors the WCAG contrast thresholds.
The simplest method is to adjust the lightness (L in the HSL model) of the text or background color. Darkening the text or lightening the background improves the ratio without changing the hue or saturation of your brand colors. Our tool automatically calculates the closest compliant color.
Also consider testing your colors with color blindness simulation. About 8% of men have color vision deficiency (protanopia, deuteranopia). A contrast that passes WCAG tests can still be problematic for a color-blind user if the colors become indistinguishable.
To go further, check our website cost estimator or view our freelance developer rates.