Using SVG effects


    You can use SVG effects to add graphic properties such as drop shadows to your artwork. SVG filters differ from their bitmap counterparts in that they are XML-based and resolution-independent. In fact, an SVG effect is nothing more than a series of XML properties that describe various mathematical operations. The resulting effect is rendered to the target object instead of the source graphic.

    Illustrator provides a default set of SVG effects. You can use the effects with their default properties, edit the XML code to produce custom effects, or write new SVG filters.

    Important: An SVG effect must be the last effect when an object uses multiple effects; in other words, it must appear at the bottom of the Appearance palette (just above the Transparency entry). If other effects follow an SVG effect, the SVG output will consist of a raster object.

To apply an SVG effect:

  1. Select the object.
  2. Do one of the following:
  3. Choose Effect > SVG Filters > Apply SVG Filter, and do one of the following in the Apply SVG Filter dialog box:
    • To apply a filter with its default settings, choose a command from the bottom section of the Effect > SVG Filters submenu.
    • To apply a filter with custom settings, choose Effect > SVG Filters > Apply SVG Filter. In the dialog box, select a filter in the list, and click the Edit SVG Filter button Edit SVG Filter button . Edit the default code and click OK.
    • To create and apply a new filter, choose Effect > SVG Filters > Apply SVG Filter. In the dialog box, click the New SVG Filter button New SVG Filter button and then enter the new code. Click OK.
  4. To preview the effect in the document window, select Preview.
  5. Click OK.
  6. Note: When you apply an SVG filter effect, Illustrator displays a rasterized version of the effect on the artboard. You can control the resolution of this preview image by modifying the document's rasterization resolution setting. (See Specifying raster effects settings.)

To import SVG filter definitions into a document:

  1. Choose Effect > SVG Filter > Import SVG Filter.
  2. Select the SVG file you want to import filters from, and click Open.

To delete an SVG filter:

    Do one of the following:

    • To delete an SVG filter from an object, select the object. Then select the SVG filter in the Appearance palette, and click the palette's trash button.
    • To delete a filter from the document's list of available SVG effects, in the Apply SVG Filter dialog box, select a filter and click the Trash button. Click Yes in the confirmation dialog box, and then click OK.

To modify Illustrator's default SVG filters:

    Use a text editor to edit the Adobe SVG Filters.svg file in the Plug-ins folder inside the Adobe Illustrator application folder. You can modify existing filter definitions, delete filter definitions, and add new filter definitions.