Vérificateur de Contraste de Couleurs (Test WCAG AA & AAA)
Contrast Ratio
:root {
--color-bg: #2563eb;
--color-text: #ffffff;
}
.element {
background-color: var(--color-bg);
color: var(--color-text);
}
Live Preview
Guide & Explanations
The Standard of Visual Accessibility: WCAG 2.1 and Beyond
Ensuring sufficient contrast between your text and its background is no longer just an aesthetic recommendation; it is an essential legal and ethical requirement for any modern digital product. Our WCAG Contrast Checker is designed to provide you with instant, indisputable validation according to W3C standards.
The Web Content Accessibility Guidelines (WCAG) define precise thresholds based on the relative luminance of colors. Our tool analyzes your palette and delivers an immediate diagnostic:
- Level AA (Standard): Requires a ratio of 4.5:1 for normal text and 3.0:1 for large text (18pt or 14pt bold), as well as for user interface components (buttons, borders).
- Level AAA (Excellence): The strictest standard requires 7.0:1 for normal text and 4.5:1 for large text.
Smart Suggest: Stop guessing your colors
If your color combination fails the test, no more random guessing in your color picker! Our exclusive Smart Suggest algorithm instantly calculates the exact shade closest to your initial intention that satisfies the requirements of the AA standard. With one click, you can apply this validated color to your live preview.
Simulate your users' perception
Accessibility goes beyond the mathematics of contrast. That's why we've integrated a color blindness simulation mode. Observe in real-time how your interface components (text, buttons, input fields) are perceived by people with protanopia, deuteranopia, or tritanopia.
Easily collaborate with your team using the Copy Share URL feature, which includes your colors directly in the web address, or export the CSS variables ready to be dropped into your stylesheet.
Frequently Asked Questions
Q: Is Vérificateur de Contraste de Couleurs (Test WCAG AA & AAA) free to use?
R: Yes, the Vérificateur de Contraste de Couleurs (Test WCAG AA & AAA) utility is 100% free. All tools on Dolf.in are accessible at no cost and without intrusive ads.
Q: Is my data secure?
R: Absolutely. Dolf.in uses a 'Serverless' approach: your data is processed locally in your browser and is never sent to our servers.
Q: Do I need to install any software?
R: No, no download or installation is required. Everything works directly in your web browser.
Q: What is a good WCAG contrast ratio?
R: For WCAG 2.1 AA (the most common standard), the ratio must be at least 4.5:1 for normal text and 3.0:1 for large text. For the AAA level (stricter), the ratios are 7.0:1 and 4.5:1.
Q: What is considered large text under WCAG standards?
R: Text is considered large if it is at least 18 points (about 24 pixels) in normal weight, or at least 14 points (about 18.5 pixels) if it is bold.