WebAIM - Web Accessibility In Mind

E-mail List Archives

Use of colour

for

From: Fernand van Olphen
Date: May 6, 2018 11:21AM

Hi everyone,

I have a question about the use of colour.

Example:
https://getbootstrap.com/docs/4.1/components/pagination/,
under the heading Disabled and active states

Colour is used to indicate that page number 2 is active. The colour of the number 2 is white, and the background is blue. The adjacent numbers are black on a white background.

I am assuming the following:

In the given example the use of colour is allowed if BOTH of the conditions are met:

Condition 1: the number 2 colour (white) and the background colour (blue) must have a contrast ratio of 4.5:1
Condition 2: the background colour (blue) and the surrounding colour (white) must have a contrast of 3:1

Is my assumption correct?

Kind regards,

Fernand van Olphen
Accessibility advisor
Municipality of The Hague
De disclaimer van toepassing op e-mail van de gemeente Den Haag vindt u op: http://www.denhaag.nl/disclaimer