30+ Material Design HTML5 Templates Available for Download (Free & Paid)

With Material Design fast spreading its reach and popularity, we have compiled a list of some of the very best material design HTML5 templates which are available for free download. These HTML5 templates are responsive and mobile-friendly and will help you give your website the perfect material design look.

All the HTML5 templates given below are easy to use and customize. You can use these material design CSS frameworks and material design icons for customizing the HTML5 website templates presented here. We also have a collection of material design resume templates.

(We have updated the post with many more free HTML5 templates built with material design. These new templates include blog templates, admin templates, landing page templates and much more. Enjoy and don’t forget to leave us a comment if you find this useful.)

Free Material Design HTML5 Templates

Links to view demo and to download these free HTML5 templates are provided with each template. Do let us know in comments if any of the links is not working and we will try our best to correct the download link.

Materialize Parallax Template

material-parallax[1]

This is a free Material design template that MaterializeCSS offers with a Header, Call-to-Action, Icon Features and Parallax scrolling.

Demo Download


Materialize Starter Template

Starter-Template[1]

This is a simple starter template offered by Materialize with a Header, Call-to-Action, and Icon Features. It features responsive design and grid layouts.

Demo Download


One Page Material Design Template

material-one-page[1]

This is a one page Material Design HTML template based off the MaterializeCSS framework. The template includes styles for several sections including work, team, and a nice big header.

Demo Download


Material Design App Landing Page

material-design-app-landing[1]

This is a simple one page HTML template design to use as an app landing page built using Project Polymer. The template is easy to setup and deploy.

Demo Download


Material Template with Jekyll

material-jekyll[1]

An HTML5 responsive template incorporating Google’s Material Design Standards along with Jekyll from Naveen Shaji.

Demo Download


Material Design Blog Template

blog_2x[1]

This is a mobile focused responsive template that showcases image or text based blog entries, a subscription CTA, search & share links, and an expanded article page with comments, counters and bookmarking capabilities built-in.

This free material design blog template is built with Material Design Lite.

Demo Download


ANDROID.COM MDL SKIN

android-dot-com_2x[1]

A Material Design Lite version of the current android.com site, using the same content with a horizontal navigation, feature carousel and long form scrolling sub pages.

This template would prove to be great for building your own material design e-commerce website with responsive menus.

Demo Download


Material Design Admin Dashboard

dashboard_2x[1]

Download this free material design admin template with a modular responsive admin dashboard built to display data visualizations and information with a clear vertical nav, user profile, search and dedicated space for updates and filters.

Demo Download


Template for Text-Heavy Page

text-only_2x[1]

Have a large amount of text in a page can be a design problem but with this clean material design template for a text heave page, you are at ease.

Built for presenting content that is information dense, easily updatable, and optimized for legibility, this template has a sticky horizontal top nav on mobile, feature callouts, cards and a site map footer with a deep-linked table of contents.

Demo Download


Stand Alone Article Template

article_2x[1]

Do you know what’s in trend these days when in comes to blog posts? A clean and content focused layout like this one.

Download this clean layout optimized for presenting text-based content with a breadcrumb nav, search, clear headers and a footer that utilizes a card-like structure to showcase the content.

Demo Download


Bootstrap Basic Landing Page Template

A basic landing page whihc is simple, clean and informative. It can offer quick presentation of your platform with a pure purpose of getting your visitors attention and guiding them further.

Demo & Download


Bootstrap Food Order Homepage Template

Food order homepage is fully customized template designed exclusively for restaurants and businesses related to the industry. The intuitive interface will guide your visitors progressively through the ordering process.

Demo & Download


Full Page Video Carousel Template

fpc-video-min[1]

Don’t limit yours carousel to just static photos. With this material design video carousel template you can embed video as easy as pictures.

Demo & Download


Half Carousel Template

hc-template-min[1]

With this half carousel template, now you can have both image carousel and your portfolio above the fold. It include responsive menus and search box too.

Demo & Download


Corporate Style Template

corporate-template-min[1]

This material design corporate style template is a clean and elegant theme suitable for displaying your product, app, business or service.

Demo & Download


Full Page Image Carousel Template

fpc-image-min[1]

This one is a full page image background slider built using the Material Design for Bootstrap carousel. You can use this template to create one page portfolio sites, and much more.

Demo & Download


Material E-commerce Homepage Template

ecommerce-template-min[1]

Giving you e-commerce website a material design look? This material design e-commerce template will surely draw eyeballs. It includes an image carousel as well as an e-mail subscription form.

Demo & Download


Full Background Image Template

fpi-template-min[1]

A lot of websites are built with full background image these days and with this free HTML template you can build one yourself with material design elements.

Demo & Download


Blog Homepage Template

blog-home-template-min[1]

Download the modern blog template with clean material design looks and large featured images for each posts. Includes a subscription form with material design animations in form fields and buttons.

Demo & Download


E-commerce Product Page Template

product-template-min[1]

E-commerce Product Page Template is a fully customizable and suitable for e-commerce websites of any purpose. Along with the e-commerce homepage template we listed above, you will have necessary templates to build a complete e-commerce website.

Demo & Download


Three Column Listing Template

3col-template-min[1]

This three Column Listing Template is provided for free from MDB template and can easily used as your new personal portfolio. It provides a modern, flat and responsive design.

Demo & Download


One Column Listing Template

1c-template-min[1]

This one column listing template can be used to display your products or projects in your portfolio with ease.

Demo & Download


Jumbotron with Features Template

jumbotron[1]

Jumbotrons are not yet out of trend yet and this beatiful and free material design template proves that jumbotrons are here to stay.

Demo & Download


Two Column Listing Template

2col-template-min[1]

Two column templates are our favorites and when they come with material design it is even better. Grab this free two column listing template from MDB’s website.

Demo & Download


Premium Material Design HTML5 Templates

If the above selection of free material design HTML5 templates does not fulfill your needs, we have also put together this handy list of some the very best premium and affordable Material Design HTML5 Templates. Some of the link below are affiliate links.

1. Material Admin – Bootstrap Admin HTML5 App

02_Theme_preview.__large_preview[1]

Material Admin is based upon the material design principle developer by Google. It’s made with Bootstrap, jQuery and Less. Material Admin includes pages for email, CRM, blog, user profile and many more. The framework contains a lot of components so you can easily create custom pages.

Demo & Download


2. Materialish – Mobile & Tablet Responsive Template

preview_590.__large_preview[1]

Materialish is a mobile and template responsive HTML5 site template. It includes 400+ Font Awesome Icons, iOS Homescreen WebApp and jQuery Swipe image slider.

Demo & Download


3. Materialism – Angular Bootstrap Admin Template

01_preview1.__large_preview[1]

Materialism is an Admin Template based on Angular JS with Bootstrap 3. The whole Template is compiled with Grunt and Bower which are tools to speed up your development significantly. With the supplied Gruntfile.js you can easily make your changes and build your own version.

Demo & Download


4. MaterialX – Material Design Personal Template

01_preview.__large_preview[1]

MaterialX is a material design Resume and Portfolio Template based on Twitter Bootstrap and Materialize, developed for professional to display their Profile, Resume, Portfolio etc. Easily customizable and fully responsive for all device.

Demo & Download


5. Material News – Multipurpose Responsive HTML

material-news-preview

Material News is a fully responsive HTML Template Based on Google Material design. It features clean design that allows visitors to focus on content. It’s very code-light, making it quick to load, and has a pleasingly clean look that’s ideal for multipurpose websites such as News, E-Commerce or blog. It is superbly responsive adapting to any kinds of smart phones and mobile devices.

Demo & Download


6. Audist – Modern Portfolio HTML5 Template

00-Audist-Preview.__large_preview

Audist is a modern portfolio HTML5 template based on material design. Fully responsive and retina ready, it includes 10 HTML5 page templates. Built on bootstrap, Audist features CSS3 effects/animations, contact form, Google map, support for Google web fonts and more.

Demo & Download


7. Fugiat – Material Design HTML5 Template

00-Fugiat-Preview.__large_preview

Baed on Google material design, retina ready and responsive Fugiat includes 16 HTML page templates that are simple to use and easily customizable.

Demo & Download


Do these material design HTML5 templates live up to your expectations and needs? Don’t forget we have a list of top Material design WordPress themes and Material design Tumblr themes too and we regularly cover responsive templates and themes on our site.

If you come across any other free material design template that we have not covered in this post then do leave us a comment below.

About the author

TemplateFlip Team

We write about the best free responsive Website Templates and WordPress Themes. Follow @templateflip for updates.

13 comments

  1. Raheja says:

    Great themes…Perfect design work

  2. HappyNewYR says:

    Many thanks for posting 🙂

  3. Ifkobato says:

    Thanks for posting! 🙂

  4. alain says:

    I downloaded the link but it’s not taking the style only the text should I change the links or something
    Thank you for the fast reply

    1. Which one did you download?

  5. Vishwanath says:

    I really love these templates, thanks for sharing. I liked Full Page Video Carousel Template. Tried to verify it in my mobile (Moto E), video is not playing whereas it is fine in desktop.

    1. Hi Vishwanath, we too did notice the video for this Full Page Video Carousel Template not playing on Android. But this is likely to do with videos on Android browser rather than the template itself. If you are able to use a video which are playable inside browsers on Android with HTML5, then you should get it working properly with this template.

  6. Ramit Suri says:

    How do I use these themes? I want to use the dashboard one, copied the files from the template over to the extracted MaterializeCSS folder but there the page doesn’t look similar to the images.

    1. Hi Ramit, once you download the zip file for “Material Design Admin Dashboard” template, you will find templates folder in the extracted zip file. Inside that folder there is another folder named dashboard which contains the dashboard template (all necessary HTML and CSS are in there) which you can use in your project.

      Do let us know if you face any more issues. Also kindly be more specific about what errors you are getting (provide screenshots if necessary) so we can be of further help.

      Thanks,
      TemplateFlip Team

      1. Sebastian says:

        Hi

        The material.js script, is for the behavior of the components right? I can create my own javascript with jquery and define my own functions without editing that file?

  7. Andrew says:

    Great material website design resources! The “materialstrap” link is broken, just FYI.

    1. Thank you for letting us know. Unfortunately that template is no longer available. However, we have updated the article with some new material design HTML5 templates.

  8. _hendra says:

    great design and positioning

Leave a Reply

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