Account for transparency when calculating WCAG color contrast
mpospese opened this issue · comments
Intro
When we perform our color contrast checking, we only look at the RGB channels and not the A. When the foreground color has alpha, it becomes blended with the background color, and it is this blended color that we should perform the check against. (If the background color has alpha, then it becomes blended with whatever is behind it, which is unknown to our package).
Tasks
- If neither color have alpha values < 1.0 then no change
- If both colors have alpha values < 1.0 we should return
.nan
for the contrast ratio and fail any comparisons. - If one color has an alpha value, we will treat it as the foreground color (although it may not be) and blend it with the other color, and then compare contrast with the second color.
Example
UIColor.secondaryLabel
when compared to UIColor.systemBackground
seems to meet AA contrast requirements across all color spaces (light/dark modes, normal/high contrast) but that's only because we're ignoring .secondaryLabel
's alpha channel. It is in fact transparent and the composite of it with .systemBackground
does not meet AA contrast requirements for normal text.