Colorfuzz is the simple accessibility color blindness testing site.
Types of color blindness
Color blindness reference, here’s a regular color wheel illustration:
Deuteranomaly is a red-green color-blindness. Affects 5.35% of the population.
Protanomaly means a missing the L-cone, different intensities of red light. Affects 1.11% of the population.
Deuteranopia is a red-green color blindness due to missing M-cone. Affects 1.1% of the population.
Protanopia is a type of red-green color-blindness. Affects 1.03% of the population.
Tritanopia is a blue-yellow colorblindness due to missing S-cone. Affects <1% of the population.
Achromatopsia is rod monochromacy. Affects 0.003% of the population.
Why build Colorfuzz
I built Colorfuzz for a few reasons. A couple of them:
One, it’s easier to see how something color blindness can affect usability on our own sites that we built.
That means using something that one could use and share quickly with a click or a link, easily wins over something that involves installing or setting up before they can use. And maybe if it is that easy to use, it helps accessibility advocates convince others on their teams to build more open sites.
You probably won’t get a site to load if it’s a site like Amazon.com or Microsoft.com or any site that wants to avoid clickjacking. Which is, like, every site really.
Using SVG filters, support is universal. The speed in which the filters are applied may be determined by your machine speed or browser rendering time. I’ve noticed extreme lag on mobile devices. More on this soon!
Method of using photoshop-like effects on SVG objects including blurring and color manipulation.
Supported from the following versions:
Mobile / Tablet
* denotes prefix required.
Stats from caniuse.com
Also published on Medium.