- From: Andrew VanWagoner <thetalecrafter@gmail.com>
- Date: Fri, 13 Mar 2015 23:01:29 -0600
- To: "Tab Atkins Jr." <jackalmage@gmail.com>
- Cc: www-style list <www-style@w3.org>
I've made an attempt to contrast against another color in a branch of css-color-function: https://github.com/thetalecrafter/css-color-function/tree/contrast-against If no contrast color is provided, then the base color is the contrast color. If no percentage is provided, then the percentage is 100%. If the contrast color's relative luminance is < .5, then the maximum contrast color is hwb(base hue, 100%, 0%), otherwise hwb(base hue, 0%, 100%). If the maximum contrast color has a contrast ratio <= 4.5 against contrast color, or the percentage is 100%, return the maximum contrast color. Determine the minimum contrast color as follows: If the base color has a contrast ratio > 4.5 against contrast color, then base color is the minimum Determine the minimum luminance as follows: (these are algebraically derived from the contrast ratio definition) If max is white, ((lum + 0.05) * minRatio - 0.05) otherwise ((lum + 0.05) * minRatio - 0.05) where lum is contrast color's luminance, and minRatio is 4.5 interpolate between base color and maximum contrast color until the base color's luminance is between minimum luminance and max color's luminance (since the change is monotonic you can binary search) blend minimum with maximum according to the percentage. (0% is just the minimum, 100% is just the maximum) Here's what I think is the key: Knowing the direction of maximum color, we can calculate the minimum contrast color's luminosity, and as we move toward the maximum color, the luminosity of base color changes monotonically. We also know which luminosity will be larger when contrast ratio is calculated. That does mean that in the contrast curve between the base color and the background color, the colors where contrast decreases are unreachable. For the #808080 problem, perhaps a better way to determine the direction of the maximum is which provides a better contrast ratio, instead of lum < .5. Then the maximum color will be black instead of white. I haven't tried that yet though. I still feel like I might be missing something though. Let me know if you see anything that doesn't look right. -Andy
Received on Saturday, 14 March 2015 05:01:57 UTC