From: Alan Gresley <alan@css-class.com>
Date: Wed, 08 Sep 2010 21:38:45 +1000
Message-ID: <4C8775C5.8080002@css-class.com>
To: "L. David Baron" <dbaron@dbaron.org>
CC: Boris Zbarsky <bzbarsky@MIT.EDU>, www-style list <www-style@w3.org>
```L. David Baron wrote:
> On Monday 2010-09-06 22:37 +1000, Alan Gresley wrote:
>> I highly object to this. Gradient interpolation must be performed in
>> non-premultiplied space. Some major reason are:
>>
>> 1. Gradients are not another vector in sRGB space (not sure how
>> matrix works).
>>
>> 2. This affects all colors in sRGB space that become have a gradient
>> to transparent. There is precise maths.
>
> I don't understand either of these reasons.  Could you explain them
> more clearly?

Ok, here we go. In sRGB space, all colors are fully opaque so any
gradient that goes from one point to another point within the sRGB
space will be a gradient of fully opaque color. This is seen with a
gradient from yellow to white, the midway of point of which is #ff7
(#ffff80 is incorrect).

You would like the midway point between a gradient between yellow and
transparent to also be #ff7, or to been non-premultiplied but this
would mean that all colors (points) within sRGB space that are
gradients to transparent would have to be somewhat non-premultiplied.
I don't know how this can be done.

To explain the precise mathematics, I will use the example of the
gradient between yellow and transparent. The current midway point as
implemented by Gecko and WebKit is #bb7 (fully opaque). This same
color #bb7 is also the midway point of the gradient from #770 to white.

Using another example, the gradient between blue and transparent. The
current midway point as implemented by Gecko and WebKit is #77b (fully
opaque). This same color #77b is also the midway point of the gradient
from #007 to white.

This all changes when the background behind the element with the

> transparent work much better.  In non-premultiplied space they all
> look black-ish in the middle.

Yes, it does look grayish or blackish but this is because our eyes
have difficulty see a light hue on a light background. If the
background is darker, the hue becomes more intense. I believe this
thing is called hyperpolarization [1]. Remember, the colors that we
see is solely on ones perception.

>> If premultiplied space gradients are allowed, this must be by an
>> added keyword. This is because a bell shape arc must be trace along
>> a vector.
>
> I don't know what you're talking about.  Could you explain?
>
> -David

Please forgive me for resorting to this test (I will make a mess of it
if I tried to express it in words).

<http://css-class.com/test/css/colors/rgb-space-125-colors-yellow-blue.htm>

Each vector field, yellow and blue have solid colored lines. According
to how gradient is currently implemented, the lines show paths that
the gradient take if mapped to sRGB space.

The yellow lines shows the color (mapped to sRGB space) when the
background is white.

The orange lines shows the color (mapped to sRGB space) when the
background is #777 (the midway point between white and black).

The yellow lines shows the color (mapped to sRGB space) when the
background is back.

The dotted green line shows the gradient from #770 to white and
the gradient from #007 to white. This is explain above where I
talk of precise mathematics.

Note: The curves or arcs would be shaped like a bell (rising sharply
and then dropping sharply) for premultiplied gradient.

The reason I object to the change to premultiplied gradient is because
I believe to would be *applied to all* gradients from opaque (or
semi-opaque) colors *to transparent*.

On a dark background, any color that is light in hue (yellow, aqua)
would reach a midway point along a gradient which matches (what I
think is) the premultiplied color and then fall sharply.

On a gray background (#777), the midway point along a gradient would
on a grayscale show a rise in the centre.

The reason for adding a keyword is that current a gradient seem to
have this opacity level along the curve (spaced as if it was a
constant, I don't know if this is the true scale).

0.1    0.2    0.3    0.4    0.5    0.6    0.7    0.8    0.9    1.0

What you are suggesting (by having #bb7 midway) seem to be something
like below with a shifting of the midway point in respect to opacity.

0.1       0.2      0.3     0.4     0.5    0.6   0.7   0.8  0.9 1.0

I hope this all makes some sense.

1. <http://en.wikipedia.org/wiki/Hyperpolarization_(biology)>

--
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
```
Received on Wednesday, 8 September 2010 11:39:18 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:38 UTC