Heads up! This blog post hasn't been updated in over 2 years. CodePen is an ever changing place, so if this post references features, you're probably better off checking the docs. Get in touch with support if you have further questions.

Google’s newly-released Material Design Lite:

Back in 2014, Google published the material design specification with a goal to provide guidelines for good design and beautiful UI across all device form factors. Today we are releasing our effort to bring this to websites using vanilla CSS, HTML and JavaScript.

It’s a visual design framework you can use on your own stuff. Think Bootstrap that looks like Google. As you explore the components they make available, you can one-click move them over to CodePen if you want to play with them, customize them, combine them, whatever.

Using Angular? Material Design gets easier and more powerful with Angular Material. The demos in their documentation also offer one-click moves over to CodePen.

We have a big collection of Material Design Pens as well. Not all of these are directly from MDL, but are people’s take on the design language.

These integrations are possible thanks to our Prefill API. You POST, we prefill!