SVG Gradients


(Nikolai V. Chr.) #1

Does anyone know how to make gradients that work? (in Inkscape)

When I try, I sometimes the opposite of how it looks in Inkscape, and sometimes some transparency that reveals what is underneath the entire SVG knob even when its solid.

Is there a special workflow in Inkscape that will produce working gradients?


(Antonio Tuzzi) #2

my guess: linear are supported, radial no


(Nikolai V. Chr.) #3

Well if I put different linear gradients on stroke and fill. Fill seems to work, but entire stroke becomes black.


(Antonio Tuzzi) #4

never tested on STROKE
but I tested dual FILL linear and they are ok (at least on BGND images)


(Nikolai V. Chr.) #5

Okay, thanks.


(Peter Vos) #6

You need to “stoke to path” first then you can use gradients on the stroke.


(Nikolai V. Chr.) #7

Thank you!


(Skrylar) #8

Stroke to Path and Object to Path are your friends for nanoVG work.

Multi-stop gradients seem iffy though.

Extension | Generate from path | Interpolate can make some interesting gradient effects out of arbitrary shapes:

g1380

But it does it by making extra shapes; so they’ll work just fine in nanoVG/Rack but you don’t want to go overboard or drawing performance will start to suck.


(Andrew Belt) #9

The reason I have not implemented gradients is because if you never use them (and don’t fake them as above), you designs will 100% always look better.


(David Rodriguez) #10

agreed