Amelia Bellamy-Royds - SVG Colors, Patterns & Gradients: Painting Vector Graphics

If youre reading this, hopefully youre already familiar with the basics of SVGhow to define a graphic as a set of shapes, and how to use that graphic either as a stand-alone image file or as markup in an HTML page. If youre not sure if youre ready, reviews the basic concepts well expect you to know.

The rest of the book focuses on the Colors, Patterns, and Gradients described in the title:

• discusses the rendering model used to convert SVG code into visual graphics, and introduces the basic properties you can set on your shapes and text to control how they are painted to the screen.

• discusses color: how it works in nature, how it works on the computer, and the many different ways it can be specified within your SVG code.

• discusses transparency, or more specifically, opacity; it introduces the many ways you can control the opacity of your graphics, and how these affect the end result.

• introduces the concept of a paint server: complex graphics content that defines how other SVG shapes and text should be painted to the screen. It also introduces the solid color paint server, which is actually more useful than it first sounds.

• looks at gradients with a particular focus on the different color transition effects you can achieve by adjusting color stop positions and properties.

• explores the ways in which you can manipulate a linear gradient to move it within the shape being painted.

• covers repeating linear gradients and some of the effects you can create with them.

• looks at radial gradients, including repeated radial gradients, and concludes with some examples of creating complex effects with multiple gradients.

• introduces the element, using it to define a single block of graphics that can be used to fill or stroke shapes or text.

• explores the more conventional usage of patterns, to create repeating tiles and textures.

• looks at some of the issues that come into play when using paint servers to paint strokes instead of fill regions.

• gives some examples of animated paint servers and discusses the benefits and limitations of the different animation methods available in SVG.

At the end of the book, two appendices provide a quick reference for the basic syntax youll need to put this all to use:

• recaps all the ways you can define colors, including all the pre-defined color keywords.

• summarizes all the paint server elements, their attributes, and the related style properties.

Whether youre casually flipping through the book, or reading it meticulously cover-to-cover, you can get more from it by understanding the following little extras used to provide additional information.