Open Sourcing MDI Light

If you follow my icon stuff a few years ago I released a 254 icon set called "Material Design Icons Light" to help fund Material Design Icons' open source efforts.

Material Design Icons Light

Shortly this icon pack will also become open source. The why is not too important, but it did not do as well as I had hoped and I would rather see people using it than not.

Built off a 24x24 grid the icons omit the top and right pixel columns to produce a single pixel stroke style.

Size

Integration in the new MDI Site

These icons will be directly integrated into the new MaterialDesignIcons.com in several ways. To adapt to having two icon sets in the new site simply appending /light will allow previewing MDI Light.

Set View All Single Icon
MDI /icons /icon/account
MDI Light /icons/light /icon/account/light

For those using the webfont with MDI they are familiar with the mdi mdi-account syntax. To access MDI Light one can simply use mdil mdil-account as the codepoints in the font will be mapped to the same values (technically mdil mdi-account would work also).

Expanding MDI Light

Expanding MDI Light not a goal at the moment, but will be in a few months. The focus will be 100% on the new site and working toward 2000 icons for the v2.0.0 release.

Progress

For those curious what it looks like for me to do this, it's manual, but I've built tooling for MDI that supports multiple font sets and other features.

Codepoints

Above I'm setting codepoint data for the release. Below is what MDI's codepoint looks like with more versions.

Hopefully will have this wrapped up shortly and can release it to everyone on GitHub/NPM/Bower.

MDI - Social Media Icon Ideas

There are many ways to style Material Design Icons for your site or app. The write-up below will go over a few ideas for social media.

See the Pen MDI - Round Social Icons by Austin Andrews (@templarian) on CodePen.

Above are some basic ideas for round and box social icons. It is also useful to bring attention to the various icons.

See the Pen MDI - Social Media Examples 2 by Austin Andrews (@templarian) on CodePen.

This article will expand over time as more ideas come along.

Be sure to checkout the MDI Collection of other helpful CodePens.