- 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