Gradients are a special case of the "fill" and "stroke" properties. Gradients consist of continuously smooth color transitions along a vector from one color to another, possibly followed by additional transitions along the same vector to other colors. SVG provides for both linear and radial gradients.

Gradients are specified within a <defs> element and are then referenced using fill or stroke properties on a given graphics object. (A <defs> element is an undrawn element containing definitions, which are referenced later in the SVG document.) Whatever is in the <defs> element is not drawn until it is referenced in an item that is to be drawn. For example:

<defs>
<radialGradient id="gradient1" cx="150.0005" cy="100" r="113.7914"
fx="150.0005" fy="100" gradientUnits="userSpaceOnUse">

Here, the element named "gradient_star" has a radial gradient (called "gradient1") that goes from yellow to orange. (Note: All color values in SVG can be defined as the hexadecimal color, the color name, or the ICC profile color with corresponding sRGB color.) Again, looking at the gradient controls in Illustrator, you can see how these numbers correspond to what you see in Illustrator and how they appear in the SVG file.