Re: [CSS4 color][CSS4 transition] color pre-multiplied vs non pre-multiplied was (Re: [CSSWG] Minutes TPAC Tue 2012-10-30 AM I: Abstract Directions, Transforms, Transitions)

On Thu, Jan 31, 2013 at 11:18 PM, Simon Fraser <smfr@me.com> wrote:

> We rely on Core Graphics to render gradients on Mac, and that can't do
> pre-multiplied. That's the main reason why gradients don't match
> transitions.
>

Yes, this is probably why FireFox is also not matching (and canvas and SVG
are also not premultiplied)

So, if we can't implement it, can we fix 'transparent' in gradients so you
get the result that was desired with the current spec?


>
> On Jan 31, 2013, at 7:25 PM, Rik Cabanier wrote:
>
> So, can we fix the spec?
> I volunteer to fix the implementation in FF and WK.
>
> On Thu, Jan 31, 2013 at 7:00 PM, Alan Gresley <alan@css-class.com> wrote:
>
>> On 25/11/2012 8:14 AM, Rik Cabanier wrote:
>>
>>> On Thu, Nov 22, 2012 at 2:39 AM, Alan Gresley <alan@css-class.com>
>>> wrote:
>>>
>>
>>  Tab: Because CSS gradient has been pre-multiplied for a while.
>>>>>
>>>>>
>>>> But still FF17, Chrome 23 and Safari 5.1.7 show gradients in non
>>>> pre-multiplied for what is now longer that a year since it was
>>>> resolved that they shouldn't because supposedly authors may not
>>>> understand that 'transparent' is shorthand for 'transparent-black'.
>>>> The reasoning behind this resolution is ill founded.
>>>>
>>>>
>>> I agree. It's interesting that they are still using
>>> non-premultiplied colors.
>>>
>>
>> FF16+ does one better. It supports _un-prefixed_ gradients using
>> non-premultiplied colors.
>>
>> <!DOCTYPE html>
>>
>> <style type="text/css" media="screen">
>> div {
>>   border: 1em solid #555;
>>   padding: 1em;
>>   background: linear-gradient(to right, rgba(255,0,255,0),
>> rgba(255,255,0,1) 50%, rgba(255,0,255,0)), linear-gradient(to right, white,
>> white 50%, black 50%, black);
>> }
>>
>> </style>
>>
>> <div>Gradients using non-premultiplied colors</div>
>>
>>
>>
>>
>>  Dino: benefit of pre-mul is you don't gray when animating to
>>>>> transparent. And can solve it by going to rgb(...)
>>>>>
>>>>>
>>>> You do *NOT* go to gray with pre-mul unless the initial color is
>>>> white or somewhere between white and black (within the grayscale).
>>>>
>>>>
>>> No, you can go to gray if for any of the interpolated values, r/g/b
>>> become approximately the same value.
>>>
>>
>> As Dino said "you don't go gray when animating to transparent." He
>> referring to the grayish (or less saturated color) midpoints when going
>> from color to transparent black. This is most noticeable when composite on
>> a whitish backgrounds.
>>
>> <!DOCTYPE html>
>>
>> <style type="text/css" media="screen">
>> div {
>>   border: 0.25em solid #555;
>>   padding: 1em;
>>   background: linear-gradient(to right, white, transparent);
>> }
>> </style>
>>
>> <div>Gradients using non-premultiplied colors</div>
>>
>>
>> This was always the main issue. When animating or transitioning from one
>> color to another color where one of the colors was transparent-black.
>>
>>
>>
>> Alan
>>
>>
>> --
>> Alan Gresley
>> http://css-3d.org/
>> http://css-class.com/
>>
>
>
>

Received on Friday, 1 February 2013 07:24:08 UTC