Webicon allows to insert any icons into your HTML. It’s like inserting icons with an icon font, but newer, better, faster, and it’ll make your hair smell nice.
PNG Fonts One
SVG file
per icon		 SVG
sets
Color icon support
Opacity
Gradients
Animations
Responsive icons
Multiple sizes
Pixel perfect
Extra files CSS
Recolor
Browser support All All IE 8+ IE 9+
Number of files Dozens and hundreds 5 (TTF, EOT, WOFF, WOFF2, CSS) Dozens and hundreds 1
CSS Tricks published a great explanation of the advantages of  SVG sets. See, we’re not the only ones nuts for SVG!
That’s where Webicon comes in — it’s an open source library that allows embedding icons from any icon library. Sounds hard? It’s not:
 
Quick and lightweight
 
     
  • Fast embedding in less than a minute
    •  
  • Only  the icons you need are loaded
    •  
  • No uploading, re-generating, or any other overhead
    •  
  • Prevents your left socks from disappearing in your washing machine
    •  
 
Works with any icon and JS library
 
     
  • Any icon library, such as FontAwesome, Material Icons by Google, Bootstrap, and Icons8. All major libraries are hosted on a free CDN
    •  
  • Supports the syntax of AngularJS and jQuery
    •  
 
Examples
 
We’d take a bullet for SVG, but let’s not get ahead of ourselves. We’ve whipped up some examples:
 
Demo for different sources and formats
 
Search icons of 30 popular icon packs