• Stars
    star
    9,320
  • Rank 3,843 (Top 0.08 %)
  • Language
    TypeScript
  • License
    Apache License 2.0
  • Created over 6 years ago
  • Updated 13 days ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Material Design Web Components

Material Web

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.

Tip: Check out the quick start guide to jump in.

Roadmap

Alpha components are in-development and may have many frequent breaking changes.

Beta components are mostly polished and ready for use, but may still have breaking changes.

Stable components are reviewed, documented, and API complete.

  • โŒ Not started
  • ๐ŸŸก In progress
  • โœ… Complete

v1.0.0 (2023)

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 โœ… โœ… ๐ŸŸก

Future

These features are planned for a future release.

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 โŒ โŒ โŒ

Browser support

This project aims to support the latest two major versions of browsers at the time of each release.

Current browsers and versions supported:

Browser Version
Chrome 112 +
Edge 112 +
Firefox 113 +
Safari* 16.4 +

* previous versions of Safari may be supported with an ElementInternals polyfill.

More Repositories

1

material-components-web

Modular and customizable Material Design UI components for the web
TypeScript
17,138
star
2

material-components-android

Modular and customizable Material Design UI components for Android
Java
16,311
star
3

material-components-ios

[In maintenance mode] Modular and customizable Material Design UI components for iOS
Objective-C
4,725
star
4

material-components-android-examples

Companion example apps and code for MDC-Android.
Kotlin
2,486
star
5

material-components-web-react

Material Components for React (MDC React)
TypeScript
2,018
star
6

material-components

Documentation and policies for Material Components (all platforms)
1,072
star
7

material-components-flutter

Modular and customizable Material Design UI components for Flutter
Dart
894
star
8

material-components-android-compose-theme-adapter

A library that enables reuse of Material themes defined in XML for theming in Jetpack Compose.
Kotlin
408
star
9

material-components-android-codelabs

Codelabs for Material Components for Android (MDC-Android)
Java
219
star
10

material-components-flutter-codelabs

Codelabs for Material Components for Flutter
Dart
212
star
11

material-components-android-motion-codelab

Kotlin
173
star
12

material-components-flutter-experimental

Work in progress code, implementation options, and design prototypes
Dart
130
star
13

material-components-web-codelabs

Codelabs for Material Components for Web (MDC Web)
HTML
128
star
14

material-components-web-catalog

Catalog of Material Components for the web (MDC Web)
JavaScript
116
star
15

material-components-site-generator

Generator of Material Components documentation sites.
JavaScript
79
star
16

material-design-for-wordpress

Material Design plugin for WordPress
JavaScript
78
star
17

material-components-flutter-motion-codelab

Codelab for Material motion for Flutter
Dart
60
star
18

material-components-ios-codelabs

Codelabs for Material Components for iOS (MDC-iOS)
Objective-C
38
star
19

material-components-flutter-gallery

Dart
22
star
20

material-components-flutter-codelabs-packages

Assets for Material Flutter codelabs
21
star
21

material-components-design-codelabs

Material Design codelabs for designers
16
star
22

material-components-ios-codelabs-2017

Codelabs for Material Components for iOS (MDC-iOS) 2017
Objective-C
15
star
23

material-components-ios-skeleton-objc

A template and sample code that you can use to start a new Material Components for iOS (MDC-iOS) application.
5
star
24

material-components-motion-experimental

Experimental work around motion
5
star
25

.github

3
star
26

.allstar

1
star