Modifying Gradients

I have a gradient as a background on several pages but need to change the colours from page to page.It would be useful if there was a way to reload an existing gradient and modify it rather than, at present, having to recreate it from scratch.

Whenever you add a CSS attribute to something, it’s either added as inline CSS, or via a class you create. So your previously created gradients are all available in your CSS, and you can simply copy the CSS that forms the gradient to duplicate to another element or class.

Although, now that I think about it, it would be nice feature to add gradients used on a site to the color picker, along with colors used. @martin?

I can certainly copy the CSS but then changing the colours, for example, means an almost complete re-write when there’s more than two colours in the gradient. The simplest way I have found is to copy the class to the new page, start a new gradient to enable me to select colours and then copy and paste the new colours into the copied and renamed gradient.

If existing gradients could be reloaded into the gradient tool for editing it would be far easier and faster.

Maybe this will help. It’s what I use when I need to create anything more than a simple, 2 color gradient.

Nice site @printninja, looks like we can just mimic those colors right into our gradient builder inside the app so we can still utilize the in app settings, very nice indeed!

I do agree with the OP though, it would be nice if we could save our gradients for reuse in some way.

I save the gradients by saving the whole component.

Ian