material-components/material-web

Health v2 · maintenance only

Adoption not part of the score

11202 stars · 1138 forks observed · 2026-08-28

What it is AI-extracted, prompt v1, taxonomy v1, 2026-08-29, confidence not recorded

Material Web (@material/web) is a library of framework-agnostic web components implementing Google's Material 3 (Material You) design system, built with Lit. It provides accessible, themeable UI elements like buttons, checkboxes, dialogs, and text fields that work across frameworks via custom HTML elements.

Use cases

• add material design components to a web app
• use material 3 design tokens for theming
• build accessible forms with styled inputs and buttons
• use the same UI components across react, vue, and svelte
• prototype a material-styled page from a CDN without a build step
• implement dynamic color and dark mode with css custom properties

When to choose

• you want Material 3 styling with framework-agnostic web components
• you use Lit or vanilla JS and want drop-in custom elements
• you need design-token-based theming with CSS custom properties
• accessibility across multiple screen readers is a priority

When to avoid

• you use Angular - Angular Material is the recommended choice
• you need long-term active development - the project is in maintenance mode pending new maintainers
• you need components still on the roadmap like data tables, date pickers, or bottom sheets
• you must support browsers older than Chrome/Edge 120, Firefox 119, or Safari 16.4

Facets

library · maturity maintenance

ui-components frontend-framework theme accessibility web-development frontend web-design cross-platform browser material-design material-3 web-components lit design-system design-tokens theming web-server nodejs

Member repositories

For agents

markdown · JSON · MCP: product_card(name="material-components/material-web")