Gradients

• Special case of fill" and "stroke" properties
• Continuously smooth colour transition along a path
• SVG provides linear and radial gradients
• Gradient defined with a defs element

  <defs>

  <linearGradient id="MyGradient">
  - - -
  </linearGradient>
  </defs>
   
  <circle style="fill:url(#MyGradient)" cx="10" cy="10" r="5"/>