Awesome Material Components

A curated list of awesome projects related to Google's Material Components.

Awesome Material Components is a collection of resources related to the official Google's Material Components library. It's opposed to the community-based implementations of Material Design featured in another list.

The purpose of this list is to increase the adoption of Material Components by sharing the knowledge about its community. So, if you have an interesting MDC-based project or tutorial, feel free to contribute.

Please don't forget to star this repo and share it among your friends! Thank you!

Contents

• MDC Web
  • MDC Web Resources
  • MDC Web Framework Integrations
  • Projects Using MDC Web
• MDC Android
  • MDC Android Resources
• MDC iOS
  • MDC iOS Resources

Material Components Web (MDC Web)

MDC Web Resources

• Documentation
  • Official Website
  • Official Documentation
  • Official GitHub Repo
  • StackOverflow Questions
• Tutorials
  • CodeLabs - Building Beautiful Sites Faster with Material Components for the web.
• Utilities
  • shuhei/material-colors - Material Design color palette in different formats (JS, JSON, Less, Sass, etc.).
  • webdenim/stylelint-config-material - Stylelint config for Material Components Web.
  • MDC Web on Fossies - The visual way to track the changes in MDC Web library.

MDC Web Framework Integrations

• Angular
  • trimox/angular-mdc-web - Angular Material Design Components. Demo - Dev chat
  • src-zone/material
• Angular.js
  • fintechstudios/angularjs-mdc
• Aurelia
  • ullfis/aurelia-mdc-bridge
• Ember
  • secondstreet/ember-material-components-web
• Preact
  • prateekbh/preact-material-components
• React
  • material-components/material-components-web-react - React.js wrapper by Material Components team.
  • jamesmfriedman/rmwc - A thin React wrapper, using foundation classes. Demo - Dev chat
  • react-mdc/react-material-components-web - React.js wrapper typed with TypeScript.
  • kradio3/react-mdc-web - Simple React.js wrapper, not using foundation classes.
  • react-material-design/react-material-design
  • gutenye/react-mc
• Vue
  • stasson/vue-mdc-adapter - Vue.js wrapper, using foundation classes. Demo - Dev chat
  • matsp/material-components-vue - Simple Vue.js wrapper, not using foundation classes.
  • balmjs/ui-vue
• Elm
  • aforemny/elm-mdc - Elm port of the Material Components for the Web.

Projects Using MDC Web

• Open Source
  • GoogleChromeLabs/sample-currency-converter - A sample currency conversion Progressive Web App.
  • vuegg/vuegg - Vue.js GUI generator.

Material Components Android (MDC Android)

MDC Android Resources

• Documentation
  • Official Website
  • Official Documentation
  • Official GitHub Repo
  • StackOverflow Questions
• Tutorials
  • CodeLabs - Building Beautiful Apps Faster with Material Components on Android
  • CodeLabs - Building Beautiful Apps Faster with Material Components on Android (Kotlin)

Material Components iOS (MDC iOS)

MDC iOS Resources

• Documentation
  • Official Website
  • Official Documentation
  • Official GitHub Repo
  • StackOverflow Questions
• Tutorials
  • CodeLabs - Building Beautiful Apps Faster with Material Components on iOS
  • CodeLabs - Building Beautiful Apps Faster with Material Components on iOS in Swift
  • raywenderlich.com - Google Material Design Tutorial for iOS: Getting Started

Contribute

Contributions welcome! Please read the contribution guidelines first.

License