Chapter 20Canvas & SVG: SVG Filter Effects

You can use filter effects in SVG. If you use any graphic design or photo manipulation packages, then you're almost certain to have come across filters before. The filters in SVG include:

  • feBlend

  • feColorMatrix

  • feComponentTransfer

  • feComposite

  • feConvolveMatrix

  • feDiffuseLighting

  • feDisplacementMap

  • feFlood

  • feGaussianBlur

  • feImage

  • feMerge

  • feMorphology

  • feOffset

  • feSpecularLighting

  • feTile

  • feTurbulence

  • feDistantLight

  • fePointLight

  • feSpotLight

If you've used image-editing software you'll probably be familiar with what filters do. Essentially, they apply effects to an image such as bezels, blurring, soft-focus, and so on. In essence, think of filter elements as a form of image processing for the ...

Get Jump Start HTML5 now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.