• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Part: II Manipulating SVG > Using Filters

Hour 10. Using Filters

Filters are one of the major differentiators between SVG and other Web graphic technologies. Filters allow developers to add effects that were once relegated to the domain of raster images (such as GIFs, JPEGs, and TIFFs). Effects like drop shadows, Gaussian blurs, and noise could only be attempted in vector graphics by attempting to manually create the effects themselves (such as placing a semi-transparent rectangle behind an object to fake a drop shadow), whereas raster programs allowed quick application of effects to objects.

SVG, however, allows you to apply filter effects to your artwork without physically affecting the original artwork. This means that a symbol can be used without effects in one section and with effects in another.

This hour will focus on the wide world of filter effects and will specifically address the following:

  • What filter effects are

  • How to apply filter effects

  • Using the following effects:

    • Blur

    • Offset

    • Merge

    • Texture

  • How to combine filter effects

  • Creating new filter effects

Filter effects are likely the most amazing visual alterations possible using SVG, and their possibilities are numerous. Accordingly, there are more effects and combinations to discuss than would be possible within a 24-hour learning period. Thus, this chapter focuses on several common effects, as well as the premise behind filter effects in general, to provide you with enough information should you decide to learn the other effects.



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint