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

Re: Gradient syntax proposal

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Wed, 19 Aug 2009 10:05:32 -0500
Message-ID: <dd0fbad0908190805o72e297d1m926692bc6fb8812d@mail.gmail.com>
To: Brad Kemper <brad.kemper@gmail.com>
Cc: James Elmore <James.Elmore@cox.net>, CSS <www-style@w3.org>
On Wed, Aug 19, 2009 at 9:49 AM, Brad Kemper<brad.kemper@gmail.com> wrote:
>
> On Aug 19, 2009, at 7:19 AM, James Elmore wrote:
>
>>> I'm just thinking there would be times when you wanted a gradient a fixed
>>> distance from the end, not just the beginning, not necessarily a mirror of
>>> the beginning measurement, so it would be nice to have a way to specify that
>>> without a lot of calc(), which is even harder to read. A second slash
>>> version doesn't seem so bad for that. Basically just a slash instead of a
>>> comma there.
>>>
>>
>> I was thinking last night (away from my beloved computer so I could not
>> send immediately ;) and thought about the possibility of using negative
>> numbers for both percentages and lengths. Positive values are distances /
>> percentages of the length FROM THE START of the gradient line; negatives are
>> FROM THE END of the line. This makes the gradient syntax simpler -- no extra
>> slash.
>
> That was actually my first idea, before I came up with the second slash
> idea. But it means changing what the tokens mean for unit measurements,
> which can complicate the implementation, I think. But more importantly (to
> me), I might actually want negative percentages and lengths to represent
> color stops that are outside the box. I find that it is not uncommon when
> working in PhotoShop on gradients, to start dragging the gradient tool from
> outside one edge, and let it up outside of the opposite edge.

Agreed - I do the same.  I mean, you could always just figure out
precisely what the color you want to start/end on is and go to that
instead, but it can often be easier to us a major color (a named one,
or one that is used often in your design) and just start/end it
outside of the box.

> In other words, I can use the distance of the first and last color stops
> control how pure the first and last colors you actually see are. For
> example:
>
> linear-gradient(top / white -20%, yellow 50% / black -30%)

Or, of course, just linear-gradient(top / white -20%, yellow 50%, black 130%)

~TJ
Received on Wednesday, 19 August 2009 15:06:33 GMT

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