• Stars
    star
    8,673
  • Rank 4,015 (Top 0.09 %)
  • Language
    TypeScript
  • License
    Apache License 2.0
  • Created about 6 years ago
  • Updated 17 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,071
star
2

material-components-android

Modular and customizable Material Design UI components for Android
Java
15,776
star
3

material-components-ios

[In maintenance mode] Modular and customizable Material Design UI components for iOS
Objective-C
4,707
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,015
star
6

material-components

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

material-components-flutter

Modular and customizable Material Design UI components for Flutter
Dart
879
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
217
star
10

material-components-flutter-codelabs

Codelabs for Material Components for Flutter
Dart
211
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
131
star
13

material-components-web-codelabs

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

material-components-web-catalog

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

material-design-for-wordpress

Material Design plugin for WordPress
JavaScript
78
star
16

material-components-site-generator

Generator of Material Components documentation sites.
JavaScript
76
star
17

material-components-flutter-motion-codelab

Codelab for Material motion for Flutter
Dart
59
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
20
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-motion-experimental

Experimental work around motion
5
star
24

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
25

.github

3
star
26

.allstar

1
star