Webicon

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