WCAG Color contrast checker - Chrome Web Store
Item logo image for WCAG Color contrast checker

WCAG Color contrast checker

Featured
4.2(

23 ratings

)
Item media 1 screenshot

Overview

To check the color contrast between foreground and background of the texts

It checks the color contrast between the foreground and background of the elements that are in the page according to the WCAG 2.2. It evaluates the contrast on all elements of the page considering their computed style for the color and background-color CSS properties. In case of these colors are defined with RGBA values, it also considers the opacity to deduce the real color that finally is show. It can simulate color blindness and evaluate the contrast for the simulations. By this way, developers can see how the pages look for colorblind users. The tool also includes two fields in which the colors can be introduced manually to be tested. It also allows to pick the color directly from the documents. Finally, it auto-refreshes when DOM of the page changes (addition or removing elements), but if the page has many changes, this behavior can be de-activated. Privacy statement on: https://rumoroso.bitbucket.io/

4.2 out of 523 ratings

Google doesn't verify reviews. Learn more about results and reviews.

Review's profile picture

Sam RevierMar 21, 2024

Love it! Would be great if you could add support for APCA and Oklch colors as well.

Review's profile picture

Bruno TonelMar 18, 2024

Stopped to work with local PDFs in last update. Please, consider to fix with a new update. Best regards.

1 person found this review to be helpful
Replier's profile picture

Jorge RumorosoDeveloperMar 19, 2024

Hi Bruno, to be honest, I never had it open when opening in the browser a PDF, so I never thought of how it would behave. I just checked the problem and I identified the reason why it is happening. I will fix it and try to release an update with the fix this week. Btw, and just to clarify. I can imagine you already know it, but it could happen that someone that reads this could think that the extension can check the contrast of the content of a PDF. The reality is that it only checks HTML, so the content of the PDF is not accessed. The problem reported is that if when opening the extension panel while vieweing a PDF in the browser, the document dissapears from the view. This didn't happen before (the PDF was still visible), so I will work in the fix. Bruno, thank you again for reporting the problem. I hope it does not annoy to much during these days until I fix it. Sorry for the inconveniences.

Review's profile picture

Joe GardinerFeb 15, 2024

Great extension for easily finding colour contrast accessibility issues - especially with the auto-update feature. Unfortunately the extension overlays on the page and doesn't appear to update the viewport, so there are parts of the page that are hidden from view that are being analysed that I can't see - it would be good if the extension either updated the viewport so that all items on the page are always visible (similar to how DevTools works) or if when you clicked on an item, it would sh... Show more

Replier's profile picture

Jorge RumorosoDeveloperFeb 23, 2024

Hi Joe, thank you very much for your comment and feedback. I am working in an improvement related with the behavior covering elements in the view. Basically, this usually happens with elements that have fixed position in the page, and what it will do is to identify them and adjust their position according to the dimension of the panel. Regarding the option to have it integrated in the browser so the extension does not need to deal with the viewport, I am reviewing if it would be possible to have it in the Chrome sidepanel. In theory I think it will be, but I need to check how to keep compatibility with other browsers (now the same code works in a standard way to all browsers engines). I'll work on it. Regarding the hidden elements, I will also introduce the option to exclude them from the analysis. My concern is that there are many ways to hide visually elements in the pages, and I have to find a reliable way to identify them. Again, thank you very much for your comment.

Details

  • Version
    3.8.4
  • Updated
    March 2, 2024
  • Offered by
    Jorge Rumoroso
  • Size
    163KiB
  • Languages
    English
  • Developer
    Email
    rumoroso@gmail.com
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

The developer has disclosed that it will not collect or use your data.

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes

Support

Related

Kontrast - WCAG Contrast Checker

3.7(16)

Quickly check and adjust contrast in realtime in your browser to meet WCAG 2.1 requirements.

Color Contrast Checker

4.9(10)

Color Contrast Checker & Recommendations Tool

EqualWeb Accessibility Checker

4.1(21)

The EqualWeb Web Accessibility Checker is a free automated auditing tool for WCAG 2.1 validation.

Accessibility Insights for Web

4.7(35)

Accessibility Insights for Web helps developers quickly find and fix accessibility issues.

Colour Contrast Checker

3.9(31)

Check the contrast between different colour combinations against WCAG standards

Color Contrast Analyzer

3.3(65)

Analyze a web page or portion of a web page for conformance with WCAG 2.0 Color Contrast requirements.

WAVE Evaluation Tool

4.1(139)

Evaluate web accessibility within your browser.

Accessible Web Helper

5.0(10)

Discover and highlight accessibility violations on the web with the push of a button.

Color Contrast Checker

3.5(2)

Section 508 - Testing Web Content Accessibility

ColorA11y

4.0(5)

This Developer Tools extension allows you determine whether or not the color contrast on a site is WCAG 2.0 AA and AAA compliant.

axe DevTools - Web Accessibility Testing

4.0(109)

Accessibility Checker for Developers, Testers, and Designers in Chrome

Screen Reader

2.5(1.1K)

A web-powered screen reader

Kontrast - WCAG Contrast Checker

3.7(16)

Quickly check and adjust contrast in realtime in your browser to meet WCAG 2.1 requirements.

Color Contrast Checker

4.9(10)

Color Contrast Checker & Recommendations Tool

EqualWeb Accessibility Checker

4.1(21)

The EqualWeb Web Accessibility Checker is a free automated auditing tool for WCAG 2.1 validation.

Accessibility Insights for Web

4.7(35)

Accessibility Insights for Web helps developers quickly find and fix accessibility issues.

Colour Contrast Checker

3.9(31)

Check the contrast between different colour combinations against WCAG standards

Color Contrast Analyzer

3.3(65)

Analyze a web page or portion of a web page for conformance with WCAG 2.0 Color Contrast requirements.

WAVE Evaluation Tool

4.1(139)

Evaluate web accessibility within your browser.

Accessible Web Helper

5.0(10)

Discover and highlight accessibility violations on the web with the push of a button.

Google apps