Material Design Icons v1.7.22

This release includes 10 new icons, but is focused on SCSS related changes reverting some style changes and adding new style changes to the Bootstrap documentation.

TL;DR If you're using v1.7.22 icons with Bootstrap, you'll want to update the helper CSS classes:

For instance in the last release this syntax will now work. The documentation and css on that page have been updated to also support this.

<button type="button" class="btn btn-default" aria-label="Flask">  
    <i class="mdi mdi-flask" aria-hidden="true"></i>
<!-- OR -->  
<button type="button" class="btn btn-default mdi mdi-flask" aria-label="Flask">  

Hopefully this doesn't cause too much of a headache. Going forward it should be a beneficial change, but could be annoying for those upgrading 1.6.x -> 1.7.22.

Preview the latest on the CDN:

Material Design Icons v1.7.12

This is a pretty standard release, with 62 new icons and a handful of changes. There are two new features in this release and an update to the bower.json file to follow the current spec.

Feature one is focused on moving to a cleaner font-family declaration. The new .mdi-set class will work the same way as .mdi did previously for uses where more than one icon is needed.

.mdi-set {

The CodePen shows the way these two classes can be used from now on.

Feature two is a little more minor adding a mdi-blank icon that has been requested several times. This is actually just the mdi-solid icon with visability: hidden.

The last update is a bit more subtle and fixes the way bower.json is structured. Read more about that in the issue.


At 950 closed issue requests the contributors have done an amazing job! Great to see so much interest in the community to help out fellow designers and importantly developers.

Preview on the CDN View the WIP Design Page

Community meta.json

The new meta.json file contains all the meta data we have about each icon and will be included in the release going forward for 3rd party tools to take advantage of.

Chrome / Firefox Extension

One great example of this new data is the Chrome Extension MaterialDesignIcons Picker it is awesome! Also available in Firefox. Created by the talented @chteuchteu.

That Conference 2016

Another year and another excellent That Conference at the Kalahari Resort in Wisconsin Dells.

That Conference

My list of favorite talks this year that I attended are below. A few of the ones below I missed myself, but they were awesome I am told.

... insert list here ...

Pokémon Slack Emojis

Playing with the new Pokémon Go game this week and realized not everyone knows each of the original 151 that are in the game. To make it easier while discussing the game in Slack I've made a yaml file to quickly install all the emojis into slack.

Slack Pokemon - Templarian/slack-emoji-pokemon

You can use the command line tool from lambtron/emojipacks to quickly install all emojis at the same time. Emojis can also be installed one-at-a-time from the emojis folder.

Let me know if you find any issues, this was one of those random 11am ideas that I had to code before passing out for the night.

Geeky Details about the Images

The images from the game are scaled by the size of physical Pokémon, which produces some odd widths and heights, so to normalize them I ran the ImageMagick command below. It basically resizes them down only when needed, but never scales them up in a 128 square.

magick convert *.png -background transparent \  
                     -gravity center \
                     -resize "128x128>" \
                     -extent 128x128 \
                     -set filename:f "%t" "out\%[filename:f].png"


Obviously all these images are owned by Niantic, Inc. / The Pokemon Company. So with that said this GitHub repo could be deleted at any time.