Vos couleurs
Formats acceptés : #E83D5C, rgb(232 61 92), hsl(), oklch() ou un nom de couleur. Une transparence sur le texte est calculée sur le fond.
Titre de section
Le texte courant doit atteindre un ratio de 4,5:1 pour rester lisible par tous, y compris sur un écran au soleil.
Petit texte : mentions, légendes, dates.
Perception des couleurs
Simulation de votre combinaison pour les principales formes de daltonisme, qui concernent environ 8 % des hommes.
Ratio de contraste
Texte large : 24 px et plus, ou 18,7 px et plus en gras. Ces seuils sont ceux des WCAG 2.2 et du RGAA 4.1 (critères 3.2 et 3.3).
Couleurs conformes les plus proches
Tester toute une palette
Séparez les couleurs par des espaces ou des retours à la ligne. Chaque case montre le texte de la ligne sur le fond de la colonne : cliquez-la pour l'analyser en détail.
Comment tester vos couleurs
- Saisissez la couleur du texte et celle du fond, en hexadécimal, en RVB, en HSL ou avec la pipette pour prélever une couleur à l'écran.
- Lisez le ratio et les cinq verdicts : texte normal et texte large aux niveaux AA et AAA, et éléments d'interface.
- Appliquez une suggestion si la combinaison échoue : l'outil calcule la teinte conforme la plus proche, en gardant la même couleur.
- Testez toute votre charte dans la grille en bas de page : chaque combinaison texte et fond y est évaluée.
Le ratio est tronqué, jamais arrondi : un ratio de 4,48:1 reste non conforme, même s'il s'affiche comme 4,5 dans d'autres outils.
Les seuils à connaître
Toujours actif
4,5:1 pour le texte
Le minimum du niveau AA pour le texte courant, exigé par le RGAA (critère 3.2) et les WCAG (critère 1.4.3).
À activer
3:1 pour le texte large
Le texte d'au moins 24 px, ou 18,7 px en gras, peut se contenter d'un ratio de 3:1 au niveau AA.
Recommandé
3:1 pour l'interface
Bordures de champs, icônes, états de focus et graphiques doivent se distinguer de leur fond (RGAA 3.3, WCAG 1.4.11).
Pourquoi le contraste est devenu incontournable
Un texte trop pâle gêne les personnes malvoyantes, mais aussi les seniors, les visiteurs sur mobile en plein soleil ou devant un écran de mauvaise qualité. C'est l'un des défauts d'accessibilité les plus répandus sur le web, et l'un des plus simples à corriger.
Depuis le 28 juin 2025, l'European Accessibility Act étend les obligations d'accessibilité numérique à de nombreuses entreprises privées, notamment les sites marchands ; seules les microentreprises de services en sont exemptées. Notre audit RGAA vous indique précisément où en est votre site.
Les pièges les plus courants
- Un texte blanc sur une photo : le contraste varie d'un endroit à l'autre de l'image. Ajoutez un voile sombre derrière le texte.
- Les textes d'exemple dans les champs de formulaire, souvent beaucoup trop clairs.
- La couleur de marque utilisée pour du petit texte : réservez-la aux titres ou aux boutons, et prévoyez une version plus foncée pour les liens, comme le permettent les variables globales d'Elementor V4.
- L'information transmise par la seule couleur : ajoutez une icône ou un texte pour les daltoniens.
Questions fréquentes
Quel ratio pour un bouton ?
Le texte du bouton doit respecter 4,5:1 avec la couleur du bouton (ou 3:1 s'il est en texte large). Le bouton lui-même doit se distinguer de son environnement avec un ratio de 3:1, sauf s'il contient un texte qui l'identifie clairement.
Les logos sont-ils concernés ?
Non. Les logos et les textes purement décoratifs sont exemptés, tout comme les éléments désactivés. Les autres textes du site, eux, doivent respecter les seuils.
Qu'est-ce que le score APCA ?
C'est la méthode de calcul étudiée pour la future version 3 des WCAG. Plus fidèle à la perception réelle, elle n'a encore aucune valeur réglementaire : l'outil l'affiche à titre indicatif.
Comment tester le mode sombre de mon site ?
Testez chaque couple de couleurs du thème sombre séparément : un texte gris clair sur fond noir peut échouer alors que sa version claire était conforme.
L'outil enregistre-t-il mes couleurs ?
Non, tout est calculé dans votre navigateur. Le bouton « Copier le lien de ce test » permet simplement de partager une combinaison avec votre graphiste ou votre agence web.
Un projet en tête ?
Parlons de votre prochain site web
Site vitrine, refonte, identité visuelle ou référencement : Alpixi accompagne les entreprises des Alpes et d'ailleurs, avec un interlocuteur unique du premier échange à la mise en ligne.
★★★★★
Noté 5/5 par nos clients sur Google
Contact direct
Agence basée à Autrans-Méaudre en Vercors
