SharePoint 2013 layouts come with a common image sprite called spcommon.png. We can access this image via CSS sprite with positioning or background technique and reuse standard layout icons in web pages.
The breakdown of css instructions for spcommon.png is documented here: http://ericoverfield.com/sharepoint-2013-spcommon-png-sprite-breakdown/
Basics:
- Build a custom CSS file using the image sprite technique
- Upload the custom CSS into the asset folder
- Make sure the web page embeds a reference to the custom CSS (custom master pages, snippet web parts)
- Use custom classes as required throughout span element