Chapter 2: Color Gradients and Style

---

Linear Color Gradients

SVG provides two types of color gradients: linear and radial. These two types of color gradients are defined in a defs section of an SVG document and then referenced as the color pattern for subsequent graphics images that you define. This facility is extremely powerful because it allows you to create color effects that would be very difficult to achieve in any other language.

A linear gradient is defined in terms of a 'start' color and an 'end' color. For example, if you define a linear gradient with a start color of '#FF0000' (which is red) and an end color of '#000000' (which is black), then the resultant color gradient will range-in a linear fashion-from red to black. A linear gradient can contain multiple start/stop color combinations; this feature allows you to create vivid color combinations.

The next topic involves the SVG defs element, and it's the mechanism by which you can provide definitions of many sorts of things. Keep in mind that 'linear gradient' and 'linear color gradient' are used interchangeably in this book, as are 'radial gradient' and 'radial color gradient.'

---