There’s a lot more to a great design than the icons, but in some cases, tiny element of web, mobile or graphic design can mean a lot. Icons are especially important in Material Design, because they are the visual expression of a brand’s products, services, and tools.
The well designed icon can signify a movement, an action, a branding or meaning, and tell the application user a lot despite being so tiny. Icons are essential elements of any mobile app or web-related project, but designing your own custom icons for each of your projects is rarely practical and it takes a lot of time. On the other hand, finding suitable icons set for an app or web project in the ocean of tens of thousands of free icons available out there, also takes a lot of time. So to help you out, we have compiled a list of well-crafted Material Design icons.
All icons come in a variety of settings and are suitable for both : mobile apps and web based projects, allowing you to work and make use of them in whatever way suits you best. You’ll definitely find at least a few icon sets that you can put to a good use in your next Material Design project, whether personal or commercial.
1. Material Design Icons by Google
Material Design Icons are the official open-source icons featured in the Google Material Design specification.
- SVG versions of all icons in both 24px and 48px flavours
- SVG and CSS sprites of all icons
- 1x, 2x icons targeted at the Web (PNG)
- 1x, 2x, 3x icons targeted at iOS (PNG)
- Hi-dpi versions of all icons (hdpi, mdpi, xhdpi, xxhdpi, xxxhdpi) (PNG)
2. Morphing Material Design SVG icons – SVG Morpheus
3. Material Design icons for AngularJS
AngularJS directive to use Material Design icons with custom fill-color and size. This project encompasses all svg icons from Google’s official Material Design Icon repository in a form of angular directive that gives option to specify custom fill-color and size. Changes to icon will go through delightful morphing if SVG-Morpheus (refer to icon set nr.2 mentioned above) is also included in your application.
4. Material Design Webfont Icons
One of the most popular Material Design icon sets among Material Design web developers community created by Austin Andrews.
Material Design Webfont is a Bower Dist, that includes the stock and community icons in a single webfont collection.
Visit Materialdesignicons.com for detailed info
Alternatively, check out this project on GitHub
5. Material Design Icons in MD colors
This one is a tool, rather than stand-alone icon set. However it might be very handy for developers while creating colorful web or mobile applications, because this source code allows you to color Google’s Material Design Icons (refer to nr.1 ) with official Material Design color scheme. As described by code developers : Google’s material design icons for Android 5.0 Lollipop, colored with the material design color scheme.
6. Google’s Material Design – free icon set
7. Free Material Design icons for Powerpoint & Keynote
To make things less messy and miserable designer Kyle Ledbetter converted 425 material design icons into native ppt & key note editable shapes! Scale & change color to your heart’s delight!
8. Material Design Icons in free PSD
This free set of PSD Material Design ‘ish icons has been posted on Dribbble by Sergey and available to download it for free here
9. Material Design Icon Template for Adobe AI
Adobe Illustrator is one of the most popular design softwares in graphic and web design industry. This simple, Material Design Icon template by Meritt Thomas is a great starting point for graphic designers to build icons in Material Design style.
10. Google inbox logo icon for Sketch
The bottom line: we have selected some of the best and free icon sets based on Google’s Material Design. However, this list could be extended as there are plenty of talented designers creating and publishing awesome Material Design icons every day. If you feel that your icons slipped out our attention, please do share it in comments below.