The <radialGradient> tag is used to define an SVG radial gradients.

The <radialGradient> tag must be nested within <defs> tag. The <defs> tag is short for definition and it allows definition of special elements such as gradients.

Copy the following code into Notepad and save the file as "radial.svg". Place the file in your Web directory only:

• The id attribute of the <radialGradient> tag defines a unique name for the gradients

• The fill:url(#grey_blue) property links the ellipse element to the gradients

• The fx and fy define the innermost circle and the cx, cy and r attributes define the outermost circle

• The color range for the gradient can be composed of two or more colors. Each color is specified with <stop> tag. The offset attribute is used to define where the gradients color begin and end

Let's look at another example: