Re: [css-color] shifting a color to make adequate contrast with another color

On Mon, Mar 16, 2015 at 6:11 PM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
> On Fri, Mar 13, 2015 at 10:01 PM, Andrew VanWagoner
> <thetalecrafter@gmail.com> wrote:
>> I've made an attempt to contrast against another color in a branch of
>> css-color-function:
>>
> [snip]
>>
>> 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.
>
> I'm not spending a bunch of time decoding your algo, but I think what
> you're doing is tracing backwards from the max-contrast color until
> you hit the min-contrast color for the first time (which'll either be
> the base color, or an interpolated color somewhere between base and
> max, if the background color has a luminosity between the base and the
> max), then doing interpolation normally?

Pick max based on background luminosity.
Find min interpolating luminosity between base and max.
Interpolate percentage between min and max.

> This is fine, but as I said, *it might not be what you want*.  It
> means that you're guaranteed to have a sensible way to interpret
> 0%-100%, but it also means that the 0% color might be *far away* from
> the base color, leaving you with only a small range of colors near
> white/black that can be used.  Maybe that's okay?  It's unfortunate,
> though, that if the base color is an acceptable contrast level, it
> won't get chosen in this circumstance.
>
> ~TJ

Can you provide an example where *it might not be what you want*?
The distance between min and base is certainly more variable, but in
the original algorithm it is *always* far away.
If the base color is an acceptable contrast level it *will* be chosen as 0%.

I have also updated the code referenced to chose the max based on
which provides better contrast.

Examples:
color(yellow contrast(brown 0%)) -> yellow
color(hsl(0, 0%, 50%) contrast()) -> black
color(hsl(0, 0%, 50%) contrast(0%)) -> rgb(23, 23, 23)
color(red contrast(yellow 50%)) -> rgb(115, 0, 0)
color(blue contrast(green 0%)) -> rgb(240, 240, 255)

-Andy

Received on Tuesday, 17 March 2015 01:02:11 UTC