Color Contrast Analyzer
- No Privacy Policy
- Live on Store
Analyze a web page or portion of a web page for conformance with WCAG 2.0 Color Contrast requirements.
New in version 1.1: Download the image analysis to a PNG file.
This extension allows you to analyze text color contrast problems on a webpage according to the WCAG 2 text color contrast requirements. It evaluates the page as it appears in the browser, so it is able to handle text over gradients and advanced CSS attributes. You can choose to analyze a portion of a web page, the entire visible contents of a tab, or an entire web page.
Additionally, you can evaluate files on your computer that can be opened in Chrome, such as image files and PDF files. Note, with PDF files you will only be able to evaluate the visible portion of the page. To analyze local files you will need to go to your Extensions page and check "Allow access to file URLs" for this extension.
You can select to evaluate for either AA or AAA conformance, along with specifying the size of the text you want to analyze.
The output will show you a map of where the edges between colors are different enough to meet the specified contrast requirement. If there is an item on the underlying page that is not outlined in the output mask, then the item does not have enough color contrast according to the conformance level you selected. The resulting image analysis can be downloaded to your computer as a PNG file.
In order to better handle gradients, you can also select the pixel radius that should be used to analyze adjacent pixels. The larger the pixel radius, the further out it will look for a border with high enough contrast. However, a larger pixel radius will add significant computation time.
When first installing the extension, you may need to refresh the webpage you wish to analyze for all of the selection options to be available.
Also, when installing the extension it will ask you for permission to access your data on all of your websites and your tabs and browsing activity. We are not using or collecting this data in any way. In order to get permission to take screenshots of your browser window this is the level of access we must request. You can view the source code at the following URL.
https://github.com/gdkraus/color-contrast-chrome
This tool is a product of the IT Accessibility Office at NC State University.
Latest reviews
Great plugin but needs development as it is no longer supported by Chrome. Happy to provide UI / UX if any developers wish to take this up in Github.
"Allow access tomb-echo is flat,cupboard 1
Wanted to add a newer review since it seems it wasn't working properly in the past. Right now it's working great on the latest Chrome/Chromium. Super useful to quickly check contrast on a page where normal contast analyzers may not be sufficient.
Page region: on a wide monitor only the top of the page is selectable. I cannot drag the rectanlge to the botton of the page.
Quite useful, works for me, a bit slow though.
Sooo; what do I do? Help link broken.
Sooo; what do I do? Help link broken.
causes console errors when enabled Unchecked runtime.lastError: The message port closed before a response was received.
causes console errors when enabled Unchecked runtime.lastError: The message port closed before a response was received.
I was wondering if it wolud be possible to update it to WCAG 3.0, works amazing
Used to be a great and simple plugin. But looks like it doesn't work anymore :(
Used to be a great and simple plugin. But looks like it doesn't work anymore :(
It works alright for scanning parts of a website, however scanning a whole page makes it crash, forcing me not only to restart it, but also to reinstall it several times. It is a good idea, and if these bugs are fixed it is well worth a 5-star review, but not until then.
It works alright for scanning parts of a website, however scanning a whole page makes it crash, forcing me not only to restart it, but also to reinstall it several times. It is a good idea, and if these bugs are fixed it is well worth a 5-star review, but not until then.
Tried to run it and crashed each time
Tried to run it and crashed each time
It worked when I originally downloaded it, now it doesn't do anything.
It worked when I originally downloaded it, now it doesn't do anything.
the topic of degree was pointless
the topic of degree was pointless
Great idea! ItsS so much helpful!!
Great idea! ItsS so much helpful!!
It's now 2021 and this checker severely needs an update. Standards have changed as well as the design of websites.
It's now 2021 and this checker severely needs an update. Standards have changed as well as the design of websites.
It is displaying this error in console: Color Contrast Analyzer - Unchecked runtime.lastError: The message port closed before a response was received.
It is displaying this error in console: Color Contrast Analyzer - Unchecked runtime.lastError: The message port closed before a response was received.
This is causing the annoying error on the console: Unchecked runtime.lastError: The message port closed before a response was received. Please fix it.
This is causing the annoying error on the console: Unchecked runtime.lastError: The message port closed before a response was received. Please fix it.
Doesn't work, hangs up
Doesn't work, hangs up
Never updated and kills mac!
Never updated and kills mac!
Made my mac crash twice after testing it on a website once it reaches 97% ... I used it a year ago it was fine but idk what happenned this time. wont recommend. Wont use it again.
Very useful in concept - However, it's nearly impossible to use on a Retina display, resizing and offsetting the selected page regions.
Very useful in concept - However, it's nearly impossible to use on a Retina display, resizing and offsetting the selected page regions.
I've used this extension for years but after the last few Chrome updates it is completely unusable and crashes Chrome. I would love to see this fixed - it's the best for checking color contrast of text on background images.
Please tell me, why does this plugin require to read my browser history? It should work fine without, right? I like that you made it open source, but i cant be sure, that the github version is the version you offer in the playstore. If you give me an answer I will happily change my review. Thanks!
Please tell me, why does this plugin require to read my browser history? It should work fine without, right? I like that you made it open source, but i cant be sure, that the github version is the version you offer in the playstore. If you give me an answer I will happily change my review. Thanks!
It was very useful, but now it doesn't work anymore on offline pages (I don't know why and I wasn't able to find any bug repor page to contact developers). It looks like an abandoned project
It was very useful, but now it doesn't work anymore on offline pages (I don't know why and I wasn't able to find any bug repor page to contact developers). It looks like an abandoned project
Not a clear UI, can't use if for contrast analysis... All it seems to do is make the screen black and white and highlight text. Bizarre.
This is exactly the tool I needed for detecting text-over-background-image contrast levels. I just capture the part of the page I need and let it do its thing. The ability to select which WCAG level it's measuring for is extremely helpful.
This is exactly the tool I needed for detecting text-over-background-image contrast levels. I just capture the part of the page I need and let it do its thing. The ability to select which WCAG level it's measuring for is extremely helpful.
Great! Thanks.
Great! Thanks.
Hi, I am interested in acquiring your extension "Color Contrast Analyzer". Please contact me at: [email protected]
Hi, I am interested in acquiring your extension "Color Contrast Analyzer". Please contact me at: [email protected]
Sadly, broke PDF rendering after a Chrome update.
Sadly, broke PDF rendering after a Chrome update.
Good idea, kudos for advancing the toolkit of web accessibility, but it crashed my ability to open PDFs in Chrome. Instead of showing the PDF, Chrome would display a blank screen. As soon as I disabled this extension, I was able to view PDFs again.