As a general rule, the hazdev-template has chosen to incorporate the material icon font pack when icons are required. A complete implementation guide can be used as a reference for optimal usage and styling. Below are instructions for incorporating the fonts into projects already using the hazdev-template as well as a few examples.


Place icons on the page using the material-icons class on an element with content indicating the name of the icon to display.

<i class="material-icons">face</i>

While all browsers supported by the hazdev-template have support for font ligatures, for maximum compatibility, you may want to use the numeric character index instead of the character name, like so:

<i class="material-icons">&#xe87c;</i>

Result: face

More Examples

Below are selected examples chosen for consistency across pages/applications within the template. The full set of icons are available if desired. Icons are listed alphabetically by name left-to-right, top-to-bottom.