# 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](https://developer.mozilla.org/en-US/docs/Web/Web_Components).
[Material 3](https://m3.material.io/) is the latest version of Google’s
open-source design system.

> Note: Looking for Material 2? `<mwc-*` components are now on the
> [`mwc` branch](https://github.com/material-components/material-web/tree/mwc).

## Links

- [Quick start](docs/quick-start.md)

## 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       | 🔴     | 🔴    | 🔴