SVG Sprites

is a Gulp plugin wrapping around svg-sprite which takes a bunch of SVG files, optimizes them and bakes them into SVG sprites of several types:

  • Traditional CSS sprites for use as background images,
  • CSS sprites with pre-defined view elements, useful for foreground images as well,
  • inline sprites using the defs element,
  • inline sprites using the symbol element
  • and SVG stacks.

First, install gulp-svg-sprite as a development dependency:
npm install --save-dev gulp-svg-sprite
Then, add it to your gulpfile.js:

var gulp       = require('gulp'),
svgSprite       = require('gulp-svg-sprite');

  .pipe(svgSprite( /* ... Insert your configuration here ... */ ))