Repolode
Submit
material-components

material-components/material-web

Material Design 3 web components built on Lit, for building accessible web apps with a buildless CDN setup or npm.

View on GitHubWebsite
Stars
11,369
Forks
1,158
Open issues
189
Last commit
3 days ago

What is it?

Material Web (@material/web) is a library of web components implementing Google's Material 3 design system. Components such as buttons, checkboxes, radios, text fields and typography styles are published as standard custom elements, so they can be used in plain HTML as well as inside React, Vue, Angular or other frameworks.

The library can be loaded directly from a CDN with an import map, requiring no build step, or installed from npm for production builds. A typescale stylesheet provides Material type styles that can be applied to any element.

The project is in maintenance mode while the team looks for new maintainers, so teams adopting it should plan accordingly.

Key features

  • 01Material 3 components published as standard web components
  • 02Usable in plain HTML or alongside React, Vue and Angular
  • 03Buildless setup via CDN and import maps
  • 04Typescale stylesheet for Material type styles
  • 05Installable from npm for production builds

Use cases

  • Adding Material-styled buttons, text fields and form controls to a static HTML page
  • Building a web app UI on Material 3 without committing to a specific framework
  • Prototyping Material interfaces quickly with a CDN import

Quick start

  1. 1

    Copy the buildless HTML example from the README into an HTML file

  2. 2

    Open the HTML file in a browser to see the components running from the CDN

Things to know

  • The project is in maintenance mode while it looks for new maintainers.

In collections

Frontend frameworks & UI components

Topics

#web-components#material-design#design-system#lit#ui-components#css#component#lit-element#lit-html#material

FAQ

What is material-web?
Material Design 3 web components built on Lit, for building accessible web apps with a buildless CDN setup or npm. Material Web (@material/web) is a library of web components implementing Google's Material 3 design system. Components such as buttons, checkboxes, radios, text fields and typography styles are published as standard custom elements, so they can be used in plain HTML as well as inside React, Vue, Angular or other frameworks.
Is material-web free to use? What license does it have?
material-web is open source under the Apache-2.0 license. Check the license terms before using it in commercial products.
Is material-web still maintained?
Actively maintained. The last commit to material-web was on Oct 22, 2026.
What can I use material-web for?
Adding Material-styled buttons, text fields and form controls to a static HTML page Building a web app UI on Material 3 without committing to a specific framework Prototyping Material interfaces quickly with a CDN import
How do I install material-web?
Copy the buildless HTML example from the README into an HTML file Open the HTML file in a browser to see the components running from the CDN
Where can I get material-web?
The source code and installation instructions are on GitHub: https://github.com/material-components/material-web

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects