KITIVERSE.LAB
Menu des Outils
MOTEUR LOCAL // DANS LE NAVIGATEUR

Vérificateur de Contraste WCAG 2.1

Vérifiez vos paires de couleurs de texte et d'arrière-plan selon les seuils d'accessibilité W3C WCAG 2.1 AA et AAA avec aperçu typographique et composants UI en direct. 100% sans inscription, traitement local dans le navigateur et stockage sur votre appareil.

APPAREIL // CONTRAST-CHECKER VÉRIFIÉ OK // 0.0ms

Tableau de Référence Rapide

Texte Normal WCAG AA Ratio ≥ 4,5 : 1
Texte Normal WCAG AAA Ratio ≥ 7,0 : 1
Grand Texte WCAG AA Ratio ≥ 3,0 : 1
Composants UI & Icônes ≥ 3,0 : 1 (Critère 1.4.11)
Ratio Théorique Maximal 21,0 : 1 (#000 vs #FFF)

Formule Mathématique

C=Lmax⁡+0.05Lmin⁡+0.05,L=0.2126Rlin+0.7152Glin+0.0722BlinC = \frac{L_{\max} + 0.05}{L_{\min} + 0.05}, \quad L = 0.2126 R_{\text{lin}} + 0.7152 G_{\text{lin}} + 0.0722 B_{\text{lin}}

Ratio de contraste W3C WCAG 2.1 dérivé des valeurs de luminance relative sRGB linéarisées par correction gamma.

Annonces

Présentation Générale et Contexte Technique

Les réglementations internationales sur l'accessibilité numérique — notamment les directives W3C Web Content Accessibility Guidelines (WCAG 2.1 / norme ISO/IEC 40500), le Référentiel Général d'Amélioration de l'Accessibilité (RGAA), l'Acte législatif européen sur l'accessibilité (norme EN 301 549) et la loi américaine ADA (Section 508) — imposent des ratios de contraste de luminance stricts entre la couleur du texte ou des composants graphiques de premier plan et la surface d'arrière-plan sous-jacente. Un contraste suffisant garantit que les utilisateurs présentant une basse vision modérée, une dégénérescence maculaire liée à l'âge, un daltonisme (protanopie, deutéranopie, tritanopie) ou consultant un écran mobile en plein soleil puissent lire le contenu sans effort.

Contrairement à une simple différence arithmétique RVB, la norme WCAG 2.1 calcule le contraste à partir de la luminance relative linéarisée ($L$) dans l'espace sRGB. Comme les photorécepteurs de la rétine humaine sont nettement plus sensibles aux longueurs d'onde vertes (71,52 %) qu'aux rouges (21,26 %) et aux bleues (7,22 %), un bleu saturé pur (#0000FF) ne possède qu'une luminance relative de 0,0722 tandis qu'un vert pur (#00FF00) atteint 0,7152. Chaque canal sRGB 8 bits subit d'abord une correction gamma inverse avant d'être pondéré dans la formule $(L_{\max} + 0,05) / (L_{\min} + 0,05)$, produisant une échelle allant de 1:1 (couleurs identiques illisibles) à 21:1 (noir pur sur blanc pur). Le Vérificateur de Contraste de Kitiverse évalue en temps réel le texte normal, les grands titres et les composants d'interface non textuels.

Comment vérifier le ratio de contraste WCAG 2.1 en ligne

Testez n'importe quelle paire de couleurs de premier plan et d'arrière-plan pour valider la conformité AA et AAA de votre interface.

1

Saisissez le code HEX de premier plan (Texte) et le code HEX d'arrière-plan (Surface), ou choisissez vos teintes visuellement à l'aide des sélecteurs de couleurs.

2

Examinez le ratio de contraste WCAG 2.1 calculé en direct ainsi que les quatre badges de validation (PASS / FAIL) pour AA Normal (4,5:1), AAA Normal (7,0:1), AA Grand Texte (3,0:1) et Icônes UI (3,0:1).

3

Cliquez sur le bouton « Inverser » pour permuter le texte et l'arrière-plan afin de vérifier le comportement de votre couple chromatique sur les boutons inversés ou badges.

4

Cliquez sur « Copier le rapport CSS » pour copier les déclarations `color` et `background-color` annotées avec le ratio de contraste WCAG exact.

Questions Fréquentes

Quel est le ratio de contraste minimal requis pour le niveau WCAG 2.1 AA ?
Selon le critère de succès 1.4.3 (Contraste minimum) des directives WCAG 2.1 et du RGAA, le texte courant de taille inférieure à 18 points (24px) ou 14 points gras (18,66px gras) doit atteindre un ratio de contraste d'au moins 4,5:1 par rapport à son arrière-plan. Les textes de grande taille ainsi que les bordures de champs et icônes actives exigent un ratio minimal de 3,0:1.
Dans quels cas le niveau d'accessibilité WCAG 2.1 AAA (7,0:1) est-il recommandé ?
Le niveau WCAG AAA impose un ratio minimal de 7,0:1 pour le texte normal et de 4,5:1 pour le grand texte. Bien que le niveau AA constitue le seuil légal standard pour la majorité des sites web publics et commerciaux, le niveau AAA est fortement recommandé pour les portails de santé, les services publics, la documentation juridique et les articles de lecture longue.
Inverser la couleur du texte et de l'arrière-plan modifie-t-il le ratio WCAG 2.1 ?
Non. La formule mathématique WCAG 2.1 divise toujours `(L_plus_clair + 0,05)` par `(L_plus_foncé + 0,05)`, ce qui la rend strictement symétrique que la couleur claire soit affectée au texte ou au fond. Toutefois, en perception visuelle réelle (prise en compte par le futur algorithme APCA de WCAG 3.0), un texte clair sur fond sombre peut présenter un léger effet de halo.
Qu'est-ce qui est considéré comme un « Grand Texte » selon la norme W3C WCAG ?
Le W3C définit un texte de grande taille comme mesurant au moins 18 points typographiques (soit 24 pixels CSS à une résolution de référence de 96 DPI) en graisse normale, ou au moins 14 points (environ 18,66 pixels CSS) en graisse grasse (`font-weight: 700` ou supérieur).
Les bordures de formulaires et les icônes doivent-elles aussi respecter un seuil de contraste ?
Oui. Le critère de succès WCAG 2.1 1.4.11 (Contraste du contenu non textuel) exige que les composants d'interface utilisateur (bordures de champs de saisie, anneaux de focus clavier, cases à cocher et icônes informatives) maintiennent un ratio d'au moins 3,0:1 par rapport aux surfaces adjacentes.
Les couleurs de ma charte graphique sont-elles enregistrées sur un serveur externe ?
Non. Kitiverse fonctionne intégralement côté client : 100% sans inscription, traitement local dans le navigateur et stockage sur votre appareil. Chaque calcul de luminance et de contraste s'effectue dans la mémoire locale de votre navigateur.

Instruments Associés dans Cet Établi

Tous les outils de Couleur & Design →
Couleur & Design →

Convertisseur de Couleurs HEX, RGB, HSL & CMJN

Convertisseur de codes couleurs 24 bits bidirectionnel traduisant en temps réel entre l'hexadécimal (#RRGGBB), CSS RGB/RGBA, HSL cylindrique et CMJN d'impression. 100% sans inscription, traitement local dans le navigateur et stockage sur votre appareil.

Couleur & Design →

Sélecteur de Couleurs & Générateur de Palettes

Conversion chromatique multiformat (HEX, RGB, HSL, OKLCH), calcul instantané du contraste d'accessibilité WCAG 2.1 et génération de palettes pastel harmonieuses. 100% sans inscription, traitement local dans le navigateur et stockage sur votre appareil.

Image & Graphisme →

Redimensionneur d'Images et Calculateur de Ratio d'Aspect

Redimensionnez vos images PNG, JPEG et WebP aux dimensions exactes en pixels, verrouillez les ratios d'aspect avec simplification PGCD (16:9, 4:5, 1:1) et calculez la taille d'impression 300 DPI. 100% sans inscription, traitement local dans le navigateur et stockage sur votre appareil.

Documents & PDF →

Organisateur et Diviseur de PDF

Organisez, réordonnez, pivotez, divisez et fusionnez vos pages PDF directement dans votre navigateur avec vignettes visuelles et extraction de plages sur mesure. 100% sans inscription, traitement local dans le navigateur et stockage sur votre appareil.

Documents & PDF →

Convertisseur d'Images en PDF

Convertissez vos images JPG, PNG, WebP, GIF et BMP en documents PDF haute résolution avec réorganisation visuelle, rotation à 90°, contrôle des marges et formats A4 ou US Letter. 100% sans inscription, traitement local dans le navigateur et stockage sur votre appareil.

Studio Vidéo →

Convertisseur Vidéo en GIF Animé

Convertissez vos vidéos MP4, WebM, QuickTime MOV et OGV en GIF animés haute qualité avec découpage temporel, réglage de cadence (10 à 24 FPS) et palette optimisée. 100% sans inscription, traitement local dans le navigateur et stockage sur votre appareil.

Note d'Exécution et de Vérification Côté Client :

Cet utilitaire fonctionne à 100 % localement dans votre navigateur avec stockage sur votre appareil et aucun envoi vers un serveur. Tous les résultats sont fournis « tels quels » — veuillez valider les données, codes et fichiers critiques avant toute mise en production.

KITIVERSE // COMMAND SEARCH
SPEC-2026
ESC

Tapez pour rechercher des utilitaires, convertisseurs et calculateurs...

Start typing tool name, category, or file format.

    ↑ ↓ navigate ↵ operate
    100% In-Browser
    DISPATCH // TELEMETRY

    Feedback & Issue Report

    0 / 1000
    Telemetry stamp (URL, viewport, form-factor) attached automatically.

    Suggest a Scale Comparison

    Propose an intuitive real-world comparison

    All suggestions are reviewed for factual accuracy prior to publication.