A pocket-sized guide to using SVG icon sprites in web apps

There are many ways to handle icons — over the last few years we went through PNG sprite maps, icon fonts, and more recently, SVG embeds. Taking it one step further, let me show you a simple, yet powerful, vector-based technique. Start with exporting each of the icons using the same artboard size (e.g: 128x128):

[sanata0130]

ポケットガイド、svgアイコンスプライトの作り方

[tacamy]

CSSで色を変えられるSVGアイコンスプライト

[Jxck]

外部 SVG の色を HTML 側の CSS で変える

[efcl]

SVGアイコンスプライトの作り方