Creating an example SVG icon grid with names for easy referencing

SVG-CSS-sprite-example.png

SVG-Icon-Grid.md

Running svg-sprite, grunt-svg-sprite or gulp-svg-sprite with the following minimal configuration

var config       = {
    "mode": {
        "css": {
            "render": {
                "css": true
            },
            "example": true
        }
    }
};

should result in the this output (cache busting hash omitted for clarity):

out/
`-- css
    |-- sprite.css
    |-- sprite.css.html
    `-- svg
        `-- sprite.css.svg

The example file sprite.css.html should display all shapes in your sprite along with their names, please see the attached screenshot. (At the time of this writing, I experience a strange display error in Chrome when using the view sprite as background image, but all other major browsers seem to work ...)