SVG Gradients
Parameters
| common | definition |
|---|---|
| gradientUnits | the coordinate system of the gradient attributes. Either objectBoundingBox or userSpaceOnUse |
| gradientTransform | the transform to apply to the gradient contents |
| spreadMethod | defines what happens outside the gradient boundaries. Either pad, reflect or repeat |
| xlink:href | link to another gradient which provides attributes or content |
| ------ | ------ |
| Linear Gradient | Definition |
| ------ | ------ |
| x1 | defines the gradient vector |
| x2 | see x1 |
| y1 | see x1 |
| y2 | see x1 |
| ------ | ------ |
| Radial Gradient | Definition |
| ------ | ------ |
| cx | the x coordinate of the outer gradient centre |
| cy | the y coordinate of the outer gradient centre |
| r | the outer radius of the gradient. The location of a 100% stop |
| fx | the x coordinate of the inner gradient centre. The location of a 0% stop |
| fy | the y location of the inner gradient centre. The location of a 0% stop |
Remarks
SVG is case sensitive so remember to use a capital G in the middle.
