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

Re: Gradients in CSS3?

From: Emrah BASKAYA <emrahbaskaya@hesido.com>
Date: Mon, 15 Aug 2005 18:50:48 +0300
To: Maniac <Maniac@softwaremaniacs.org>, www-style@w3.org
Message-ID: <op.svj3myfx8nstxa@lomarnona>

On Mon, 15 Aug 2005 17:34:12 +0300, Maniac <Maniac@SoftwareManiacs.Org>  
wrote:

> While I think it does specify direction (from two first values to two  
> second ones) but I got your point. Then may be just a list of keywords:  
> 'left-right', 'top-bottom', 'tl-br', 'bl-tr'. Just these four. They give  
> direction and I think cover most use cases (well, may be not most but  
> many). And flexibility, as you say, goes to SVG.
>
>> That is far less flexible though, and I
>> can't see that any user of CSS would have problem using degrees;
>>
> I'm talking about complexity for authors. CSS is mostly hand-written  
> after all, and it's hard to count atan(57/143) in mind.
>

I'd like such a feature, but if WG would ever to put such a property, I'd  
say go all the way and put degrees (0-90 only) in it. Why? Because PNG24  
(when you make sure you turn off dithering) gives -extremely- small images  
for straight gradients anyway and is supported by anything under the sun.  
But it fails to provide the same compression for angled gradients. (on a  
600*300px image, top down, side to side gradients compress to about 1KB,  
but give the gradient a 20 degree angle, it jumps to 10KB's)

I am not saying straight gradients would not be nice to declare right in  
CSS, but it'd just be much better if it was to support degrees. Using  
degree as keywords would be real simple, and it would be restricted to  
0-90 degrees for easier definition.
  *First color always defines the top-left desired color
  *Second color would always define the desired bottom right color)

e.g. background: grad(red blue 20deg)

So we wouldn't need to define center and width of the gradient or use  
tangents when defining our grad, plain and simple CSS.
Here is a mock-up for browser interpretation:
http://www.hesido.com/display/cgtalk/gradbrowserinterpret.png



-- 
Emrah BASKAYA
www.hesido.com
Received on Monday, 15 August 2005 15:51:20 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:40 GMT