- From: Lea Verou <leaverou@gmail.com>
- Date: Mon, 21 Mar 2011 19:46:21 +0200
- To: www-style@w3.org
- Message-ID: <4D878EED.2020604@gmail.com>
I've discussed this privately with Tab a while ago and since he thought
it's a good idea, I figured I'd post it here to get wider feedback.
Conical gradients (sometimes referred to as angle gradients) are
gradients created by a line segment rotated around one of its endpoints
(which forms the center of the gradient), while smoothly transitioning
its color. There's not really a "gradient line" concept in those (like
in linear or radial gradients), but an imaginary "gradient ellipse"
instead, around the container box.
Some visual examples of the effect can be found by googling
<http://www.google.com/images?q=conical+gradient&um=1&ie=UTF-8&source=og&sa=N&hl=en&tab=wi&biw=1280&bih=636>
its name.
Those are quite common in graphic design, especially when combined with
semi-transparent radial gradients on top. Photoshop and many other image
editing applications offer such a gradient type out of the box. They are
widely used in color pickers (for the hue wheel), starbursts, shiny
metal textures and many other interesting effects. The twitter homepage
also uses one on its header. Moreover, they can be used to make some
patterns easier to code, like checkerboards.
Its grammar could be something like:
<conical-gradient> = conical-gradient(
[<bg-position>,]?
<color-stop>[, <color-stop>]+
)
<bg-position> having the same meaning as it does for radial gradients
(where the center is).
--
Lea Verou (http://leaverou.me | @LeaVerou)
Received on Monday, 21 March 2011 17:46:58 UTC