Share
Check WCAG AA/AAA color contrast ratios for accessible web design.
The quick brown fox
Sample text at normal size
Large text (18px+)
Enter valid hex colors above (e.g. #1f2937)
Check color contrast ratios against WCAG 2.1 accessibility guidelines. Enter foreground and background colors to instantly see the contrast ratio and whether your color pair passes AA or AAA criteria for normal and large text. Essential for accessible web design.
Quickly verify if your color combinations meet web accessibility standards for AA and AAA compliance.
Enter your foreground color
Input the hex code or color value for your text or icon into the foreground field.
Enter your background color
Provide the hex code for the background element to calculate the specific contrast ratio between the two layers.
Review the calculated contrast ratio
The tool instantly displays the numerical ratio based on WCAG 2.1 formulas.
Check AA and AAA compliance
Verify if your color pair passes the accessibility requirements for both normal and large text sizes.
Adjust colors to meet standards
Modify your color selection if the results show a failure to ensure your design is accessible to all users.
Estimated time: PT1M

how to use design tools
Learn how to use design tools effectively to create stunning visuals. Master CSS generators, color palettes, and accessibility checkers with this expert guide.

WCAG Contrast Checker: Ensure AA & AAA Color Compliance
Ensure web accessibility with our WCAG Contrast Checker. Instantly calculate contrast ratios for normal and large text to meet AA and AAA design standards.
Share this tool
Remove whitespace and comments to minify CSS code.
Upload an image and get all favicon sizes + HTML link tags.
Generate custom placeholder images with any size, color, and text.
Extract dominant colors from any image and export as HEX, RGB, HSL, CSS, or JSON.
Visually create CSS box shadows with live preview and one-click copy.
Design custom CSS border radius shapes with live preview.
Convert text or Markdown to a Word .docx file with live preview, RTL, and page-setup options.
See your public IP address plus full location, ISP, ASN, timezone, coordinates, and more.
Load and compare multiple URLs side by side in resizable iframes.
Play local or online videos with HLS stream support, subtitles, playlist, and bookmarks.
Convert Markdown to a fully customized, RTL-ready PDF.
Record your screen directly in the browser. Download as WebM video.
Create shareable URL playlists with live iframe preview and password protection.
Buy social media marketing services — followers, likes, views and more.