[css-images-4] Add ability to change radial gradient focus

[fantasai]

During the discussions that led into the current radial-gradient() syntax, there was an extended proposal that included the ability to specify the geometric center and color focus of the gradient separately. That proposal is summarized in
https://lists.w3.org/Archives/Public/www-style/2011Nov/0210.html
and consists of a from <position> or from offset <offset> argument (depending on whether an absolute position or relative offset is desired), and was slated for consideration for a future level of CSS Images, so copying here.

[bradkemper]

The use cases beyond background images seem pretty limited. And for that we have background-position.

[bradkemper]

The use cases beyond background images seem pretty limited. And for that we have background-position.

[AmeliaBR]

@bradkemper This is unrelated to background position. It's about creating asymmetrical gradients.

Some examples of what off-center focal points look like, using the SVG syntax, so people know what we are talking about (click on screenshot to go to code version):

A real off-center SVG gradient (left), versus faking it with multiple layered CSS gradients:

All the the major rendering engines already support this for SVG (except that WebKit doesn't support repeating SVG gradients).

For me, the spherical shading effect is the most practical use-case. But the off-center repeating gradients are fun, too.

[AmeliaBR]

@bradkemper This is unrelated to background position. It's about creating asymmetrical gradients.

Some examples of what off-center focal points look like, using the SVG syntax, so people know what we are talking about (click on screenshot to go to code version):

A real off-center SVG gradient (left), versus faking it with multiple layered CSS gradients:

All the the major rendering engines already support this for SVG (except that WebKit doesn't support repeating SVG gradients).

For me, the spherical shading effect is the most practical use-case. But the off-center repeating gradients are fun, too.

[bradkemper]

Ah. OK.

[bradkemper]

Ah. OK.