W3C home > Mailing lists > Public > www-style@w3.org > August 2010

Re: [css3-images] Gradients feedback

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Sun, 29 Aug 2010 13:20:28 -0700
Message-ID: <AANLkTi=2h3cR0Foqv+-7DN0bHqZ51jaHvN=jiO39AsjM@mail.gmail.com>
To: Boris Zbarsky <bzbarsky@mit.edu>
Cc: www-style list <www-style@w3.org>
On Sun, Aug 29, 2010 at 11:12 AM, Boris Zbarsky <bzbarsky@mit.edu> wrote:
> On 8/29/10 12:56 PM, Tab Atkins Jr. wrote:
>>
>> This is because, currently, transitions to and from 'transparent' look
>> ugly
>> - going yellow->transparent produces a visibly grayish area in the
>> middle because the color is going from yellow->black while the opacity
>> goes from 100%->0%.  This will still be the case in premultiplied
>> space because 'transparent' is *defined* to be 'rgba(0,0,0,0)', but if
>> you're using premultiplied colors you can do a
>> yellow->rgba(255,255,0,0) transition
>
> No, no.  The whole point is that in non-premultiplied space the halfway
> point between rgba(255, 255, 0, 1) and rgba(0, 0, 0, 0) is rgba(127.5,
> 127.5, 0, 0.5) while in premultiplied space it's rgba(255, 255, 0, 0.5) [1].
>  You don't have to change any endpoints or startpoints to get better
> behavior here in premultiplied space; it Just Works.  This is key for
> getting interoperable behavior, which is hard to achieve with "well, you
> could do this thing or this other thing".  ;)

Ah, okay.  Color math still confuses me; I'm sure there are reasons
for doing things the way they're done, I just don't understand them.

What I was implying wasn't ambiguous, though.  You get perfectly fine
interop behavior out of saying "interpolate each component
individually".  That's just not the behavior you want.  ^_^

> [1] More precisely, in non-premultiplied space the point |t| between
> rgba(r1, g1, b1, a1) and rgba(r2, g2, b2, a2), where 0 <= t <= 1 is:
>
>  rgba((1-t)r1 + t*r2, (1-t)g1 + t*g2, (1-t)b2 + t*b2, (1-t)a1 + t*a2)
>
> For the special case of r2 = g2 = b2 = a2 = 0 ("transparent") this
> simplifies to:
>
>  rgba((1-t)r1, (1-t)g1, (1-t)b1, (1-t)a1)
>
> which will look closer and closer to gray as t -> 1, except with an alpha
> approaching 0 going on.  The effect of looking gray will thus be most
> pronounced for some value of t in the middle there.
>
> In premultiplied space, the point |t| is:
>
>  rgba( ((1-t)r1*a1 + t*r2*a2) / a3,
>        ((1-t)g1*a1 + t*g2*a2) / a3,
>        ((1-t)b1*a1 + t*b2*a2) / a3,
>        a3 )
>
> where a3 = (1-t)*a1 + t*a2.  For the special case of r2 = g2 = b2 = a2 = 0
>  you get:
>
>  rgba(r1, g1, b1, (1-t)*a1 + t*a2)
>
> which is precisely a fade that preserves the original color while changing
> the opacity until you get to "transparent".   And in particular, this is
> true no matter what color "transparent" is in rgba, as long as it has alpha
> == 0 (a consequence of all such colors being equal to each other numerically
> in premultiplied space).

Yeah, color math goes over my head.  I'll just nod.

~TJ
Received on Sunday, 29 August 2010 20:21:21 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:30 GMT