Material Design Lite CSS Creator

This tool creates a minified CSS for the Material Design Lite Project. The project already provides a customization tool, but only in the official Google Material Design colors.

My goal was to provide a way to use every color you want, so you can adapt your Material Design Lite website to your specific colors.

Since version 1.0.2 of the Material Design Lite it works well, because only five color-variables inside the template CSS are replaced. Latest tested version is 1.2.1. You only have to paste the template CSS of the Material Design Lite Project into the "Template CSS" textbox. The template CSS can be created the following way: You have to clone the GIT-Repository, or download an actual release and build it with Gulp (Node.js is also required). You have to type "gulp styletemplates" into your command line to create the necessary "material.min.css.template" file which is located inside the "dist" directory.

If you want to contact me, please leave a comment in my blog post: http://blog.zubasoft.at/2015/08/material-design-lite-css-creator/
Primary Color
Primary Dark Color (Brightness of Primary typically - 10 %)
Accent Color (Brightness typical 90 - 100 %)
Template CSS:




Result:
Theme Preview
Tab 1 Tab 2
Theme Preview

Try it out

Lorem ipsum dolor sit amet.