Material Components for the Web


Building Beautiful Sites Faster with Material Components for the Web


Developed by a core team of engineers and UX designers at Google, Material Components (MDC) helps developers execute Material Design. MDC has over 20 beautiful and functional UI components for the web platform and is also available for Android and iOS.

This codelab will show you some situations where Material Components for the web (MDC Web) can make your app more functional and beautiful, while saving you engineering time.

What you will build

In this codelab, you’re going to complete Shrine, an e-commerce app that sells clothing and home goods. Your app will:

MDC Shrine

Components you’ll be using

Code blocks are for you to simply copy and paste.

Next step: Set up your development environment