Versions Compared


  • This line was added.
  • This line was removed.
  • Formatting was changed.


Suggested Adobe Illustrator CC Settings

The following export SVG export settings seem to work well:

  • Export using Artboards. To make best use of this, make sure the artboard is cropped tight to the artwork.
  • SVG Options dialog
    • Styling: Internal CSS
    • Font: SVG
    • Images: Preserve
    • Object IDs: Layer Names
    • Decimal: 2
    • Minify - checked
    • Responsive - checked

SVG Sprites

For lots of icons it would be easier to work with a single SVG sprite that could be cached by the browser. However, we don't want to have to keep adding in additional icons to the sprite as new ones are required, similar to the font creation issue with font icons. Fortunately, grunt-svgstore provides a way of compiling individual SVG files into a single file. Additionally it provides options for cleaning up the SVG and adding custom IDs for the each sprite based on the original file name.