Re: Linear gradients: state of the proposal

On Nov 6, 2009, at 2:54 pm, Tab Atkins Jr. wrote:

> On Fri, Nov 6, 2009 at 12:56 PM, Brad Kemper <>  
> wrote:
>> On Nov 6, 2009, at 10:50 AM, "Tab Atkins Jr."  
>> <> wrote:
>>> I'm not sure I understand how the angle would flex, and currently
>>> believe I would find it *very* confusing if I said "45deg" and ended
>>> up with a gradient that wasn't a straight diagonal.
>> The idea is that the spec would make it clear that you are  
>> specifying the
>> angle as though on a square, but that the final image is  
>> dimensionless and
>> could (would) be stretched and distorted. Just as though you  
>> created a
>> square image in Photoshop with a 45deg gradient, and then resized  
>> the image
>> (except you would have resolution independance).
> Ah, I see.  Yeah, I'm really not happy with doing that.  It's a level
> of abstraction that I believe would be confusing and, frankly, has
> zero benefit.  Right now I say directly what the size of the 'box' is
> that the gradient uses to size itself, and I think that it's useful
> the way it is.


So how is this for explaining how linear gradients should work:

A linear gradient description is composed of:
	* Two points that describe the opposite corners of a box which the  
gradient will cover.
		* If no points are specified, the box is the element's box, and an  
angle of [insert "South" angle] is used.
		* If one point is specified, then the second point is obtained by  
reflecting the first point around the center of the box.
		* If only one component of a point is specified, then the other  
component defaults to 'center' (like background-position).
	* Optionally, an angle. If specified, the angle controls the axis of  
the gradient, while the spread of the gradient is governed by the  
"fill the box" rule, where the box is given by the "two point" rules  

The "fill the box" rule is basically what Brendan drew out:

I think this is a simpler way of saying what Tab's proposal does, but  
rather than describing all the logic about start points and end points  
with angles, it just says that those two points are used to describe a  
box, and "fill the box" rules are used to determine the spread of the  

What's left is to decide whether to use "protractor style" or "SVG  
style" angles.

I think the tide of opinion is against Brad's idea of describing  
angles on a square and then allowing stretchiness, so I didn't include  
it above.


Received on Saturday, 7 November 2009 04:12:32 UTC