Menu

100+ Free Material Design Resources to Improve Your Website

Material design is introduced by google on august 2014 and is getting popular, because it is a matter of simplicity and reality. It uses surfaces, shadows, transitions etc… All the terms in material design are familiar to you as well so it is easy to understand.

Now we would like to add to this post some amazing Material design resources who will help to improve your web design to a new and modern look. People are already started using Material design we have seen many UI design kits based on material design. Some of the designs we found were excellent and worth inspecting.

In this post, you can see a lot of free web design things based on material design system like UI kits, icons, backgrounds etc…. You can find both design and development Material Design Resources here.


You may also like:


 Material Design Backgrounds 

Free Set of 40 Material Design Backgrounds

Free-Set-of-40-Material-Design-Backgrounds

Download Source


Material Design Wallpaper

Material-Design-Wallpaper

Download Source

Free Set of 30 Material Design Backgrounds

 Free-Set-of-30-Material-Design-Backgrounds

Download Source


Free New Set of Material Design Patterns

free-new-set-of-material-design-patterns

Download Source


Material Background

material-background

Download Source


Free new set of material design backgrounds

free-new-set-of-material-design-backgrounds

Download Source


Free set of material design backgrounds

free-material-design-backgrounds

Download Source


12 material design backgrounds

free-material-design-backgrounds2

Download Source


10 material design backgrounds

10-material-design-backgrounds

Download Source


Colored modern material design vector background

My profile

Download Source


 Material Design UI Kits 

Material Design UI Kit

Freebie-PSD-Material-Design

Download Source


Material Design Dark UI Kit

material-design-dark-ui-kit

Download Source


Crystallize Free Material Ui Kit

Crystallize-Free-Material-Ui-Kit

Download Source


Free Summeric Material Ui Kit

Free-Summeric-Material-Ui-Kit

Download Source


Free Material Design Ui Kit

free-material-design-ui-kit-2

Download Source


Material Design UI Kit PSD Free Download

Material-Design-UI-Kit-PSD-Free-Download

Download Source


Free UI Kit for Your Online Store

Free-UI-Kit-UX-PSD-iOS-8

Download Source


Free Material UI Kit PSD

free-material-ui-kit-psd

Download Source


Simple UI Kit

simple-ui-kit

Download Source


Blog/Magazine Flat UI Kit

blogmagazine-flat-ui-kit

Download Source


 Material Design Web Icons 

Material Web Icons

material-web-icons

Download Source


Material Design Icon Templates (Ai)

Material-Design-Icon-Templates

Download Source


Free Material Design Icon Pack

Free-Material-Design-Icon-Pack

Download Source


Free Set of Material Design Hand Gestures

free-set-of-material-design-hand-gestures

Download Source


New Set of Free Material design avatars

material-design-avatars

Download Source


Free Set of Server – Hosting Material Design Icons

free-set-of-server-hosting-material-design-icons

Download Source


Free New Set of Material Design Stationary Icons

free-new-set-of-material-design-stationary-icons

Download Source


Set of Free Isometric Material Icons vol. 3

set-of-free-isometric-material-icons-vol-3

Download Source


Set of Free Isometric Material Icons vol. 2

set-of-free-isometric-material-icons-vol2

Download Source


Free set of isometric material icons

free-set-of-isometric-material-icons

Download Source


Dog-ear material icon template (PSD)

Dog-ear-material-icon-template-Freebie

Download Source


Flat Serivces Icons (PSD)

Freebie-PSD-Flat-Serivces-Icons

Download Source


Google Maps & Streetview Icon (AE File)

Google-Maps-Streetview-icon

Download Source


Calculator Icon (Ai)

Calculator-Freebie

Download Source


Angular Material Icons (EPS)

Angular-Material-Icons

Download Source


Material Design Icon Template – Freebie (PSD)

Material-Design-Icon-Template-Freebie-PSD

Download Source


Android Lollipop Icons

android-lollipop-icons

Download Source


Material Design Flat Avatar Set

material-design-flat-avatar-set

Download Source


Google Icons (Ai, Sketch)

Google-Icons

Download Source


Material Design Powerpoint & Keynote icons

Material-Design-Powerpoint-Keynote-icons

Download Source


System Icons – Material Design

System-Icons-Material-Design

Download Source


Material Icons Pack (SVG, Sketch)

Material-Icons-Pack

Download Source


Google JFK Icons (ICO, PNG)

Google-JFK-Icons-ICO-and-PNG

Download Source


1000 Material Design Icons

Thousand-Material-Design-Icons

Download Source


Google Material Design – Free Icon Set

Free-Material-Design-Icons-Set

Download Source


Material Design Icons (PSD)

Material-Design-Icons

Download Source


Cartoon Faces

cartoon-faces

Download Source


 Material Design Mockup Templates 

Nexus 6P Mockup

nexus-6p-mockup

Download Source


Perspective Screens Mockup

perspective-screens

Download Source


Free Nexus 9 PSD

Free-Nexus-9-PSD

Download Source


Nokia Lumia 1520 mockup

nokia-lumia-1520-mockup

Download Source


Google Nexus 5 Mockup

google-nexus-5-mockup

Download Source


iPhone 5c 3D View FREE PSD Vector Mockup

iPhone-5c-3D-View-FREE-PSD-Vector-Mockup

Download Source


Moto X Mockup

moto-x-mockup

Download Source


 Material Design Website Templates 

Brench Portfolio Template PSD

brench-portfolio-template

Download Source


Free Landing Page Bundle

Free-Landing Page Bundle

Download Source


Be Material – One Page Material Design PSD Template

be-material-one-page-material-design-psd-template

Download Source


Barter.Li – Android L Web And Mobile Interface

Barter-li-Android-L-Web-and-Mobile-Interface

Download Source


Free Travel PSD Template

Freebie-Travel-PSD-Template

Download Source


Food Magazine Template PSD

food-magazine-template

Download Source


404 Error Page

404-error-page

Download Source


 Material Design Admin Templates 

Free Education Dashboard

Free-Education-Dashboard

Download Source


Google Material Design Admin Theme

Admin-theme-free-sample-download

Download Source


Samdash Smart Admin Dashboard

Samdash-smart-admin-dashboard-Design-freebie

Download Source


Material Login, Dashboard Pages

Material-Login-Dashboard-Pages

Download Source


Dione Dashboard Free PSD

Dione-Dashboard-Free-PSD

Download Source


 Material Design Applications / Frameworks 

Materialize

Materialize

A modern responsive front-end framework based on Material Design.

View Source


Material Framework

Material-Framework

Material Framework is a simple responsive CSS framework made by Tim Nguyen that allows you to integrate Material Design in any web page or web app.

View Source


Paperkit Framework

Paperkit-Framework

Paperkit is an opensource Material Design web framework that works on HTML, CSS and JavaScript Vanilla.

View Source


Material UI

Material-UI

A CSS Framework and a Set of React Components that Implement Google’s Material Design.

View Source


Papyros

Papyros

Papyros is a modern operating system which adheres to Google’s Material Design guidelines and is based on Arch Linux.

View Source


Leaf

Leaf

A CSS framework based on Google’s material design.

View Source


OpenLocalization

OpenLocalization

OpenLocalization is a localization management web-app to help you translate any of your projects. Its goal is to provide a simple and flexible tool to easily edit and deploy your application translations.

View Source


LumX

LumX

The first responsive front-end framework based on AngularJS & Google Material Design specifications.

View Source


MUI

MUI

MUI is a lightweight HTML, CSS and JS framework for sites that follow Google’s Material Design guidelines.

View Source


Polymer

Polymer

Polymer brings an implementation of material design to the web. The paper elements range from controls to effects and user interaction.

View Source


Angular Material

Angular-Material

The Angular Material project is an implementation of Material Design in Angular.js. This project provides a set of reusable, well-tested, and accessible UI components based on the Material Design system.

View Source


Ionic Material

Ionic-Material

Ionic material is currently an experimental extension library for the Ionic Framework, meaning you won’t change the way you develop your Ionic hybrid apps to have them materialized. Ionic Material aims to integrate the best representations of Material Design into a single add-on library for Ionic Developers.

View Source


 Material Design Articles 

Exploring Google’s Material Design With Polymer

Exploring-Google-Material-Design-with-Polymer

View Source


9 Principles Google Created For Its Colorful ‘Material Design’ UI Refresh

9-principles-Google-created-for-its-colorful-Material-Design-UI-refresh

View Source


Make Material Design Websites With The Materialize CSS Framework

Make-Material-Design-Websites-with-the-Materialize-CSS-Framework

View Source


Top Designers React To Google’s New ‘Material’ Design Language

Top-designers-react-to-Googles-new-Material-design-language

View Source


What Material Design Means For The Future Of Android

What-Material-Design-Means-For-the-Future-of-Android

View Source


What You Can Learn From Google’s Material Design

What-You-Can-Learn-From-Googles-Material-Design

View Source


 Material Design Color Palette 

Material Design Color Palette

Material-Design-Color-Palette2

View Source


Material Color Palette For Sketch

Material-Color-Palette-for-Sketch

View Source


Material UI Colors

Material-UI-Colors

View Source


GOOGLE COLOR STYLE GUIDELINES

google-color-style-guidelines

This color palette comprises primary and accent colors that can be used for illustration or to develop your brand colors. They’ve been designed to work harmoniously with each other.

The color palette starts with primary colors and fills in the spectrum to create a complete and usable palette for Android, Web, and iOS. Google suggests using the 500 colors as the primary colors in your app and the other colors as accents colors.

View Source


MATERIAL DESIGN COLORS

material-design-colors

This small web tool helps you visualize the material design colors and also easily copy the colors in different formats. Just click to select.

View Source


MATERIAL UP

material-up

Material Up generates colors based on Google’s Material Design palatte.

View Source


MATERIAL PALETTE

material-design-palatte-generator2

View Source


Material Design Color Palette

Material-Design-Color-Palette

Material Design Color Palette is a LESS/CSS toolkit for easily usage material colors by Google in websites.

View Source


Material Design Color Palette Sketch Plugin

Material-Design-Color-Palette-Sketch-Plugin

Sketch app plugin for displaying Google Material Design color palette.

View Source


 Material Design Other Resources 

Music player PSD freebie

Day 009 - Music player by Dima Blover

Download Source


Material inspired login form | Freebie

Material-inspired-login-form-Freebie

Download Source


Login UI

Login-UI-Free

Download Source


Sketch freebie for material theme paper

Sketch-freebie-for-material-theme-paper

Download Source


FREE Loading Spinners

FREE-Loading-Spinners

Download Source


Pluto – Material Design FREE Bootstrap Template

Pluto-Material-Design-FREE-Bootstrap-Template

Download Source


ToRoute – Travel Service Concept

toroute-travel-service-concept

Download Source


Material Design Image fonts

Material-Design-Image-fonts

Download Source


Material Design Widget

material-design-widget

Download Source

2 Comments
  1. Alex March 25, 2016

Leave a Reply

Your email address will not be published. Required fields are marked *