Improved color palette as of September 2016, compliant to WCAG 2.0 level AA
Find a palette that complies with the below listed criteria while staying true to our Wikimedia identity (trustworthy, academic, neutral, open, inviting).
WCAG 2.0 color contrast guidelines:
WCAG 2.0 level AA compliance (normal text size and 18pt+) – necessarily
WCAG 2.0 level AAA compliance (normal text size and 18pt+) – where possible
2022 update for people browsing by this task: It makes 0 sense to have some colors AAA compliant, the affected user groups still can't work with majority of interface. What we aim for instead is making our products work with specific software of those user needs, while supporting AA out of the box.
A user with 20/40 would thus require a contrast ratio of 3 * 1.5 = 4.5 to 1. Following analogous empirical findings and the same logic, the user with 20/80 visual acuity would require contrast of about 7:1 [to pass all four criteria including WCAG AAA at normal text size].
Tools used for contrast checking: Webaim, Snook.ca, Contrast checker
Tool used for color-deficiency simulation: Sim Daltonism (Mac OS, iOS); alternatively: Accessibility color wheel (Online tool, simulating protanopia, deuteranopia & tritanopia)
We're checking mostly on the most common color-deficiency— the Red–green color blindness (Protanopia, deuteranopia, protanomaly, and deuteranomaly).
This deficiency experience difficulty with discriminating red and green hues.
All chosen colors must be extensible and modular. This is so we can apply as little guideline as possible and let the usage be as endless as possible for all contributors.
Be mindful of the most used text colors—white and black.
Current situation after T110555:
//
Report from Contrast checker:
//
Tested on Sim Daltonism for the most common color deficiency:
- Protanopia
- Deuteranopia
- Protanomaly
- Deuteranomaly