WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Colour contrast and blue light filters


From: Jonathan Avila
Date: Jan 31, 2019 7:30AM

This is an interesting question and one that also comes up with invert colors as that changes the contrast ratios as well. From my experience with blue light filters is that they are a spectrum that the user can specify and typically remove blues and warm the colors with more reddish colors. So I'd imagine it would impact contrast of colors that have more blue in them -- but this only a guess since I am not an expert in color.

Testing could be difficult if the filter is applied in such a way that the contrast tools can't get the value. You may need to apply the filter values to the colors first and then run them through a contrast checker -- depending on the configuration. There are both browser and platform level blue light filters so they may work differently.


Jonathan Avila
Chief Accessibility Officer
Level Access
703.637.8957 office

Visit us online:
Website | Twitter | Facebook | LinkedIn | Blog

Looking to boost your accessibility knowledge? Check out our free webinars!

The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Patrick H. Lauke
Sent: Thursday, January 31, 2019 7:45 AM
Subject: Re: [WebAIM] Colour contrast and blue light filters

CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.

On 31/01/2019 12:34, Pat Reynolds wrote:
> We are working on a major overhaul of colours on all our sites, to make
> them AA compliant. Does anyone know how these filters might impact on
> accessibility, and what we might do to mitigate that?

I'm assuming that you mean you're going to ensure the colour contrast
ratios of all foreground/background colour combinations are AA compliant
- minimum 4.5:1 for "regular" text / 3:1 for "large" text (and, if doing
WCAG 2.1, also minimum 3:1 for meaningful non-text content).

It will depend on the specific blue light filter used (as I don't think
there's any particular standard way in which these work), but while
these filters generally result in a duller/less pronounced/lowered
contrast overall, following at least the minimum WCAG contrast ratios
should still result in a strong-enough contrast. To be on the safe side,
stronger contrasts (not just trying to squeak past the 4.5:1 ratio, for
instance) will be better and safer. If it's a major concern, you can
always run a simulated blue filter and test the contrast ratios AFTER
the filter was applied, and tweak to ensure that they're strong enough
even when the filter is on.

Of course, with regards to WCAG, you should also ensure that color alone
is not used as an indicator/to convey meaning, as this may also
otherwise cause problems for users that run a blue filter.

Patrick H. Lauke

www.splintered.co.uk | https://github.com/patrickhlauke
http://flickr.com/photos/redux/ | http://redux.deviantart.com
twitter: @patrick_h_lauke | skype: patrick_h_lauke