Skip to content
ChromaFocus is an accessibility color tool strategy for analyzing effects of WCAG contrast (low vision target) and various forms of colorblindness. The first release (ChromaFocus LITE) is designed as an base contrast/colorblindness color-picker that instructs/teaches the user how to anticipate their options and maintain accessibility requirements
JavaScript CSS HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Purpose of ChromaFocus LITE

ChromaFocus LITE is a next-generation Contrast and Colorblind Color-Picker designed around the idea that designers and developers need to start anticipating their color-picking results rather than using the traditional "shot in the dark" technique. To accomplish this, the user must have the following...

1. A visual (or non-visual) understanding of how the WCAG 2.0 Contrast Algorithm works
2. The ability to make increasingly adept color-picking choices based on that knowledge

How ChromaFocus LITE works

ChromaFocus LITE gives the user "filters" that allow them to anticipate the results of their color picking behaviors. The filters are designated by the contrast requirements of WCAG 2.0, namely double-a and triple a standards.

By activating a filter, ChromaFocus LITE will provide both visual and audio (for screen-reader users) feedback on the pass-fail results of their color-picks, AND also the range of values which will cause a "failure" in the first place.

This means that the user can actively predict where and when the color channel, whether red, green or blue, will fail the test. By knowing that, they can make increasingly more sophisticated decisions and "bets".

ChromaFocus LITE's Colorblind Filter is not screen reader accessible at this time. Discussions are being held on the best means to facilitate screen reader usage of this feature. Opinions on this subject are welcome and encouraged through the github site.

Final Note:

If you are using a MacOS, you will need to enable full keyboard access in the MacOS preferences, otherwise you will be unable to tab through links, which is part of the UI.

You can’t perform that action at this time.