mirror of
https://github.com/material-components/material-web.git
synced 2024-09-19 17:47:46 +03:00
Material Design Web Components
232982ef03
- Material Symbols is recommended for M3 - Refactor list items to use md-icon directly PiperOrigin-RevId: 511601359 |
||
|---|---|---|
| .github | ||
| actionelement | ||
| autocomplete | ||
| badge | ||
| button | ||
| checkbox | ||
| chips | ||
| controller | ||
| decorators | ||
| dialog | ||
| divider | ||
| docs | ||
| elevation | ||
| fab | ||
| field | ||
| focus | ||
| icon | ||
| iconbutton | ||
| list | ||
| localization | ||
| menu | ||
| menusurface | ||
| motion | ||
| navigationbar | ||
| navigationdrawer | ||
| navigationtab | ||
| radio | ||
| ripple | ||
| sass | ||
| segmentedbutton | ||
| segmentedbuttonset | ||
| slider | ||
| switch | ||
| testing | ||
| textfield | ||
| tokens | ||
| types | ||
| .gitignore | ||
| .release-please-manifest.json | ||
| CHANGELOG.md | ||
| css-to-ts.js | ||
| LICENSE | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| release-please-config.json | ||
| tsconfig.json | ||
| web-test-runner.config.js | ||
Material Web
IMPORTANT: Material Web is a work in progress and subject to major changes until 1.0 release.
Material Web is Google’s UI toolkit for building beautiful, accessible web applications. Material Web is implemented as a collection of web components. Material 3 is the latest version of Google’s open-source design system.
Note: Looking for Material 2?
<mwc-*components are now on themwcbranch.
Links
Roadmap
Alpha components are in-development and may have many frequent breaking changes.
Beta components are mostly polished and ready for use.
Stable components are reviewed, documented, and API complete.
- 🔴 Not started
- 🟡 In progress
- 🟢 Complete
1.0 Components
| Component | Alpha | Beta | Stable |
|---|---|---|---|
| Button | 🟢 | 🟢 | 🔴 |
| FAB | 🟢 | 🔴 | 🔴 |
| Icon button | 🟢 | 🔴 | 🔴 |
| Checkbox | 🟢 | 🟢 | 🔴 |
| Chips | 🔴 | 🔴 | 🔴 |
| Dialog | 🟢 | 🟢 | 🔴 |
| Divider | 🟢 | 🟢 | 🟡 |
| Elevation | 🟢 | 🔴 | 🔴 |
| Focus ring | 🟢 | 🔴 | 🔴 |
| Field | 🟢 | 🟢 | 🔴 |
| Icon | 🟢 | 🔴 | 🔴 |
| List | 🟢 | 🟢 | 🟡 |
| Menu | 🟢 | 🟢 | 🟡 |
| Progress indicator (circular) | 🔴 | 🔴 | 🔴 |
| Progress indicator (linear) | 🔴 | 🔴 | 🔴 |
| Radio button | 🟢 | 🟢 | 🔴 |
| Ripple | 🟢 | 🟢 | 🟡 |
| Select | 🟡 | 🔴 | 🔴 |
| Slider | 🟢 | 🟢 | 🔴 |
| Switch | 🟢 | 🟢 | 🔴 |
| Tabs | 🔴 | 🔴 | 🔴 |
| Text field | 🟢 | 🟢 | 🟡 |
1.1+ Components
These components are planned for release after 1.0.
| Component | Alpha | Beta | Stable |
|---|---|---|---|
| Autocomplete | 🟡 | 🔴 | 🔴 |
| Badge | 🟡 | 🔴 | 🔴 |
| Banner | 🔴 | 🔴 | 🔴 |
| Bottom app bar | 🔴 | 🔴 | 🔴 |
| Bottom sheet | 🔴 | 🔴 | 🔴 |
| Segmented button | 🟡 | 🔴 | 🔴 |
| Card | 🔴 | 🔴 | 🔴 |
| Data table | 🔴 | 🔴 | 🔴 |
| Date picker | 🔴 | 🔴 | 🔴 |
| Navigation bar | 🟡 | 🔴 | 🔴 |
| Navigation drawer | 🟡 | 🔴 | 🔴 |
| Navigation rail | 🔴 | 🔴 | 🔴 |
| Search | 🔴 | 🔴 | 🔴 |
| Snackbar | 🔴 | 🔴 | 🔴 |
| Time picker | 🔴 | 🔴 | 🔴 |
| Tooltip | 🔴 | 🔴 | 🔴 |
| Top app bar | 🔴 | 🔴 | 🔴 |