Free Material Design Icons
Material design matters to UX/UI designers. The 10 best free material design icons in 2018 for app interface design. Best design inspirations and resources.
- Material Design Icons Font Free Download
- Free Material Design Icons
- Free Download Material Design Icons
- Material Design Android
- Free Material Design Weather Icons
Material Design, a full platform design language, provides standards for designers to create websites and apps with a consistent look and feel. From the overall interface to the tiny details, Google proved it’s digital perfection. Icons play a big role in Material Design. Material Design turns icons into meaningful signs that are the shortcuts that replace 1- 4 words. I’d like to share the 10 best free material design icon resources for your inspiration. Just pick the right ones and integrate them into your design.
1. Google Material Design Icons - Google Material Icons
Material Design for Bootstrap. 400+ material UI elements, 600+ material icons, 74 CSS animations, SASS files, templates, tutorials and many more. All fully responsive. All compatible with different browsers. If you want to start designing material websites and apps like a pro, first check out what Google says about this trend, then browse this gallery of free material design resources and pick something for you. The 40 freebies featured here will become a nice launch pad for a project of any size.
Format: PNG, SVG
Price: Free
Usage pattern: Web, Android, and iOS projects
What’s special:
- 900+ icons all from a single, small file.
- Served from Google Web Font servers or can be self-hosted.
- Supported by all modern web browsers.
- Colored, sized and positioned entirely with CSS.
- Vector-based, looks great at any scale, retina displays, low-dpi display screens.
Google Material Design Icons provide over 900 excellent icons. They are available in a variety of sizes and densities and as a web font. Material icons are beautifully crafted, delightful, and easy to use in your web, Android, and iOS projects.
Download here: https://material.io/icons/
2. Material Icons from Icons8 - Material Design Social Icons
Format: PNG, SVG (in any format)
Price: Mostly free (some features of the icons are paid)
Usage pattern: Apps for the Web, Mac, and Windows
What’s special:
- Compare Material Icons With Other Styles.
- Single Style, all icons are done by one designer so your user interface will look consistent.
- Editable Vectors, vector icons are not merged and have preserved shapes. (paid)
- Fonts Generator, pick only the icons you need and build your own, small font. (paid)
- Icon Recoloring, pick a color and it will generate recolored versions of your PNG or SVG.
- HTML Embedding, get a code to paste an icon right into your HTML.
- Mac & Win Apps, allows you to search icons quickly and works well with Photoshop.
You have access to 4,400 material design icons in any format, size and color in 20 seconds. There are social media icons like Facebook, Twitter, Youtube, and all kinds of arrows. It also has basic ones like phone, home, and settings. If you are up for something more unorthodox, this is the right place for you.
Download here:https://icons8.com/material-icons/
3. Material Design Icons
Format: PNG, SVG, XAML
Price: Free
Usage pattern: All systems
What’s special:
- Free updates.
- Supports download separately, in single file.
- Web font is available.
- Vector drawable, including line icons and solid icons.
- Supports open source.
This icon resource library is very rich and contains varied types with nearly 4000 free icon resources. This huge free resource platform is a collection of numerous UX/UI designers sharing their own design results. You can see the name of the icon and its designer when you hover over it.
Download here: https://materialdesignicons.com/
4. Materialpalette
Format: PNG, SVG
Price: Free
Usage pattern: iOS & Android
What’s special:
- 16 types, including the material design search icon, and material design menu icon.
- Bulk download freely.
- Vector icons, looks great at any scale and screen size.
This library provides typical free material design icons. The page provides a search box to quickly search icons making it, easier to find and get what you really need. It also offers a palette and color picker.
Download here: https://www.materialpalette.com/icons
5. Materializecss
Format: PNG, SVG
Price: Free
Usage pattern: All system
What’s special:
- Usage - to be able to use these icons, you must include this line in the <head>portion of your HTML code Download all at a time.
- Sizes - to control the size of the icon, change the font-size: 30px property of your icon.
The site offers 932 Google material design icons in total. The icons can be used in prototype design for UX/UI designers and used directly by developers to develop apps.
Download here: http://materializecss.com/icons.html
6. Material Icons Design from Flaticon
Format: Vector icon (SVG & EPS), PNG, PSD and Iconfont
Price: Free
Usage pattern: All systems
What’s special:
- Support creating patterns with the icons directly.
- Share freely.
- Download all at one time.
Material Design Icons Font Free Download
This site offers a comprehensive arrey of Google material design icons. They are divided into 9 pages for better display. They are applicable to Google Material Design and Monochrome. You can select the icons to view more information and make operations like edit, share, or add to favorites.
Download here: https://www.flaticon.com/packs/material-design
7. Webalys
Format: .Sketch, .AI, .SVG, .PDF, .EPS, .Iconjar files.
Price: Free pack - 350 icons
Essential pack - $87 for 1650 icons
Ultimate pack - $127 for 40000 icons
Usage pattern: All system
What’s special:
- Various pack choices.
- Google Material Design Guidelines.
- Each icon was separately drawn in 2 versions, so you get a total of 8,000 icons.
- The Nova icons are provided in all essential files used by developers and designers, including Sketch, Illustrator, SVG, PDF.
It says “the World's Biggest Material Design Icons Pack”, and touts itself as the only icons pack that include all icons in solid and line style, for designing applications and websites. It’s legible and consistent. The Nova icons follow the Google Material Design Guidelines to ensure consistency, readability and clarity even at small sizes. You can import the 8,000 icons into the Iconjar application in one click.
Download here: http://www.webalys.com/nova/
8. Material UI
Free Material Design Icons
Format: SVG, PNG
Price: Free
Usage pattern: All system
What’s special:
- Search box to quickly find icons you need
- Both line icons and sold icons
This icon library supports single download. Each icon has four modes: Black, grey, white, SVG. There is a variety of sizes you can choose from. All the icon information can be viewed in detail. You can also copy the SVG code.
Download here: https://www.materialui.co/icons
9. Material Design Icon Template PSD
Format: PSD
Price: Free
Usage pattern: All system
What’s special:
- Personal use for designers.
- Comes with matched UI kits.
Mac & Apple Devices - EveryMac.com's Ultimate Mac Lookup. Lookup Mac, iPod, iPhone, iPad, Apple Watch, Apple TV and other Apple devices by Apple Order Number, Model Number, EMC Number, Model Identifier, and Serial Number as well as Intel processor number to check its specs and other details. Apr 19, 2019 If you can't use About This Mac or System Information because your Mac doesn't finish starting up, look for a serial number or model name on the outside of your Mac, or on its original packaging, receipt, or invoice. You can also log in to appleid.apple.com and look for your Mac in the Devices section. Click on your Mac to view its serial number. Your Mac’s serial number is printed somewhere on the Mac itself, so you’ll be able to find it if you can’t turn your Mac on. Flip over a MacBook and you’ll see the serial number printed on the Mac itself, near the “Designed by Apple in California” text. On a Mac Mini, you’ll find the serial number on the bottom. If you still have your Mac’s original box, then you’ll find the serial number printed on the box’s barcode label. If you purchased your Mac from the Apple Store in person then this information will also be included on the purchase receipt, and if you purchased it from the online Apple Store then the serial number will be included on your email receipt. May 20, 2019 Mac’s are also not exceptional, they do have serial numbers. The serial number of the Mac is tied with the motherboard. It is also printed somewhere on your Mac hardware for identity. The serial number is embedded on your machine software and as well as on hardware. It is easy to find the serial number of Mac laptops and iMac’s using MacOSX. Find mac with serial number generator.
- Future updates.
It’s an ultimate template of icons designed in Material style. It includes guideline grid, material shapes for the creation of an awesome icon. It also provides android screens so you and your customers could see the icons live and scaled in all resolutions.
Download here：https://www.uplabs.com/posts/material-design-icon-template-psd
10. Material Design Icons By Brad Williams
Format: SVG, PNG
Price: Free
Usage pattern: All systems
What’s special:
- Enables 1000+ Material Design icons within WordPress pages and posts.
- Shortcode generator – includes an easy-to-use TinyMCE pop-up shortcode generator.
Free Download Material Design Icons
These icons are is provided by designer Brad Williams; this resource contains more than 1000 Material Design icons that can be used on WordPress pages and blogs. In addition, icons can be inserted using shortcodes or HTML tags. The icon resource can be used in 3 different ways: shortcode, HTML and TinyMCE.
Download here：https://con.wordpress.org/plugins/material-design-..
I have provided what I consider to be the 10 best material design icon resources from my side. Since most of them are free of charge, you can try one or all them out. We all know that icons affect user experience. So, how do you use them effectively? How do you integrate them into your projects? How so you ensure that the icons match with the overall Material Design interface?
You need to practice. Practice makes perfect. We all know that prototyping is of great importance. When you use the right prototyping tool, you can build an app with a good-looking interface and excellent interactions quickly and effortlessly. Here I take Mockplus as an example. I will show you how to quickly use those icons in design with this tool.
Technogym Technogym is known all over the world as 'The Wellness Company' - a company that has helped to develop the hedonistic concept of 'fitness' into a true lifestyle: Wellness. Technogym excite console manual. Burn more calories with Cross Training, for greater exercise variety, and Hills, for a more gradual workout. Choose one of our new interval training workouts. Or alternate effort phases, switching between pushing as hard as you can and recovering, with Hi-Low Blocks.
Powerful input icon resources in Mockplus
Mockplus comes with more than 300 components and over 2,000 vector icons itself. With a simple drag and drop, you can build interface design. In its properties panel, you can set icons for visibility, color, transparency, etc. You can also convert them into pictures for more applications with a single click.
Easily make use of the above material icons resources in Mockplus
You can also import all the above icon resources into the Mockplus component library. You can also share them with your team members to improve component reusability and reduce workload.
How to use the above icon resources in Mockplus? Here we go.
1) Create a component library
Open Mockplus and create a new project. Select the component library icon on the left panel, click '+' to create a new component library and name it as “material design icons”. You can also add descriptions or change thumbnails.
2) Import material icons
Select the library 'material design icons', and click “import image” on the drop-down menu of the '+' icon, or right-click on the library can also find the import image options. Then with one click, you can import the icons in Mockplus with a batch of 100 icons at a time. Mockplus currently supports PNG and JPE format icon resources.
3) Share you component library
Now you can see that the icons are already in your component library. How do you share these icon resources? Click the management button next to the '+' icon to enter the component library management interface. Here you can synchronize, edit, export, and delete the component. Click “share to” then add the accounts of your team members in order to share it with them.
More free material design icons resources:
1. Material Design
This repository contains all the planning for current and work-in-progress Material Design Icons. It also contains converted icons from Google's official icon set. Not that SVG icons are not compressed in GitHub. You will need to manually edit the CSS file to remove the version query string.
Download here：https://github.com/Templarian/MaterialDesign
2. Material Design Blog
This is a free master set of beautiful Material Design icons by Jurre Houtkamp. It contains colorful, bold, well-crafted, Material Design style icons from Amsterdam based designer Jurre Houtkamp. It’s available in .icns, .ico and .png file type.
Download here：http://materialdesignblog.com/free-master-set-of-m..
3. Material Design Powerpoint & Keynote icons
Powerpoint & Keynote is still used in the business world. To make things less miserable, this designer converted 425 material design icons into native ppt & key editable shapes! You can change scale and color freely.
Download here:https://dribbble.com/shots/1932096-Material-Design..
4. Material Design Icons
750 free open-source glyphs from Google.
Download here: https://www.producthunt.com/posts/material-design-..
5. Material-design-icons
Material design by Google. It includes all versions.
Download here: https://cdnjs.com/libraries/material-design-icons
6. Google Material Design icons
617 vector icons that you can freely add to your collections.
Download here: https://www.iconfinder.com/iconsets/google-materia..
Related readings: