Iconify

Iconify is an open-source alternative to the webfont.

It works similar to the webfont, but with few differences:

• Icons are rendered as SVG, not as glyphs.
• Iconify only downloads icons that are used on website instead of loading entire font.
• Instead of loading font you need to load small JavaScript file.

That makes Iconify easy to use with large icon sets, such as Material Design Icons.

To use Material Design icons with Iconify, add the Iconify script tag to the header or footer of your page:

<script src="//code.iconify.design/1/1.0.6/iconify.min.js"></script>

See Iconify.design for latest script link.

To add any icon to page write a placeholder HTML code:

<span class="iconify" data-icon="mdi-account"></span>

That's all there is to it. Iconify will replace it with SVG.

Iconify icons set is updated within 24 hours after Material Design SVG repository is updated.

You can find list of supported icons on Iconify MDI collection page.

If you click any icon in icons list mentioned above, Iconify will show you different code options and links to tutorials. For example, see mdi-account icon page.

Iconify fetches icons from Iconify API servers. But what if you want to host everything on your own servers? You can host your own Iconify API. See Iconify API hosting documentation.