Re: Talk on radial gradients

On Tue, Aug 25, 2009 at 10:27 AM, David Perrell<davidp@hpaa.com> wrote:
> In the case of linear gradients, the repeating moz gradient example* can
> easily be reproduced with Tab's proposal by generating a corner-to-corner
> diagonal gradient 'image' and tiling it.

To be fair, it's not necessarily 'easy' in my bare syntax, and
impossible in radial-gradient.  In linear, you can probably do it like
this:

linear-gradient(-45deg, red, blue, red, blue, red)

And then using background-size to shrink it how you want,
background-position to shift it a bit (the moz example starts at 20px
20px), and background-repeat to tile it.  You can't do the immediately
obvious thing of just going red->blue->red, because then opposite
sides are transitioning differently and won't match up when you
repeat.

> It's not clear to me how the moz repeating radial gradient is rendered. If
> the scale of the gradient remains constant as it repeats outwards then it
> does not strike me as useful.

I'm also not certain of the exact details, especially with regards to
the gradient center.  There are at least two plausible ways I could
imagine it working.

~TJ

Received on Tuesday, 25 August 2009 16:01:37 UTC