Iconography

For icons that were not available or for which we could not find an appropriate style from Font Awesome, we created custom icons. Included in these customized icons are icons that are used for graphical purposes (e.g., Auto-pay and Report an Outage). Icon Specs: 500x500 pixels and between 10 -15kb (on a transparent background)

• Download the icons here

Glyphs are used on the Consumers Energy site for utility purposes, as seen in the examples. The icon font library Font Awesome is often used for websites because its icon fonts are scalable, work well on all frameworks, and can be customized in the CSS.

For Consumers Energy, we’ve implemented Font Awesome. It can be found here. Any icon found on their site can be invoked in a page using the < i > tags and the appropriate classes.