Add section on CSS Sprites

README.md

@@ -5,6 +5,7 @@ Material Design Icons are the official open-source icons featured in the Google
 ## What's included?
 
 * SVG versions of all icons in both 24px and 48px flavours
+* SVG and CSS sprites of all icons
 * 1x, 2x icons targeted at the Web (PNG)
 * 1x, 2x, 3x icons targeted at iOS (PNG)
 * Hi-dpi versions of all icons (hdpi, mdpi, xhdpi, xxhdpi, xxxhdpi) (PNG)
@@ -34,6 +35,42 @@ You can also find all the icons on [npm](http://npmjs.org).
 $ npm install material-design-icons
 ```
 
+## Structure
+
+### Icons
+
+### Spritesheets
+
+Material Design icons come with SVG and CSS sprites for each category of icon we include. These can be found in the `sprites` directory, under the `svg-sprite` and `css-sprite` sub-directories.
+
+#### Using CSS Sprites
+
+To use a CSS spritesheet, reference the stylesheet for the icon category you wish to use, then include the icon definition in your markup. 
+
+E.g: to use one of the play icons in `css-sprite-av`, we would do the following:
+
+Reference the stylesheet:
+
+```html
+	<link href="css-sprite/sprite-av-black.css" rel="stylesheet">
+```
+
+Create an element which will use the icon as a background:
+
+```html
+	<div></div>
+```
+
+Add a class referencing the `icon` spritesheet and specific icon `icon-ic_play_circle_outline_black_24dp`, which you can get from the above stylesheet.
+
+```html
+	<div class="icon icon-ic_play_circle_outline_black_24dp"></div>
+```
+
+That's it!
+
+Don't forget to publish the corresponding CSS and SVG/PNG files when deploying your project.
+
 ## Usage
 
 Take a look at the included `index.html` file for a preview of all icons included in the set. You are free to use the icons in the way that makes most sense to your project.