Adopt Material Design 3 / Material You

I'm sure you're tracking the pulse of material design standards like me and others. That being said, material ui version 3 is out.

We should track MUI being migrated from Material Design v2 to Material Design version v3.

I'm sure they'll be a few tickets that come out requesting the adoption, so I figured this ticket could act as a stub and catch-all for MUI support for the design language's latest update.

Cheers

References

• MD 3 Docs https://m3.material.io/
• MD 2 Docs https://m2.material.io/
• Ionic's discussion on the problem https://github.com/ionic-team/ionic-framework/issues/24282
• Vuetify's discussion on the problem https://github.com/vuetifyjs/vuetify/issues/14332
• Quasar's discussion on the problem https://github.com/quasarframework/quasar/issues/11139
• Google's discussion on the problem https://github.com/material-components/material-web/issues/2441
• The docs traffic on MD 3 vs MD 2: https://www.similarweb.com/website/m3.material.io/?competitors=material.io
• Material Design traction on Figma MD 2 Figma file vs. MD 3 Figma file
  • January 12, 2022: MD2 4.8k stars 256k copies, MD3 1.9k stars 39.6k copies
  • March 24, 2022: MD2 5.6k stars 277k copies, MD3 4.2k stars 91k copies
  • August 23, 2022: MD2 6.5k stars 307k copies, MD3 5.8k stars 132k copies
  • October 6, 2022: MD2 6.8k stars 315k copies, MD3 6.6k stars 155k copies
  • December 20, 2022: MD2 7.2k stars 327k copies, MD3 8.9k stars 214k copies
• React Native Paper: https://github.com/callstack/react-native-paper/issues/3126
• Flutter https://github.com/flutter/flutter/issues/103537
• Angular Material: https://github.com/angular/components/issues/22738

Design kits

• https://github.com/mui/mui-design-kits/issues/135
• https://github.com/mui/mui-design-kits/issues/103

Real adoptions of Material You in the wild?

Desktop

• https://relay.material.io/
• https://httpie.io/app feels inspired by it
• Gmail partially, which feels relatively yolo
• Others?

Mobile

• Google Pixel Phones. "Canalys puts Google fifth in U.S. phone market share, with just a 1.7% in Q3 2022." source. It's insignificant. All the other phone manufacturers skin Android, so don't use Material Design 3.
• Others?

Migration

If you wish to contribute, start with the contributing guide

Progress

List of components and their current migration status

Start with packages/mui-material-next/CONTRIBUTING.md and the component issue and specification links in the Progress list. No single file, test, or entry point is named; a contributor would need to choose a specific unchecked component and follow its linked issue. Done would require that component's Material 3 migration and corresponding progress entry to be complete.