Repolode
Enviar
material-components

material-components/material-web

Web components do Material Design 3 baseados em Lit para criar apps acessíveis, com configuração sem build via CDN ou instalação pelo npm.

Ver no GitHubSite
Estrelas
11,369
Forks
1,158
Issues abertas
189
Último commit
há 3 dias

O que é?

Material Web (@material/web) é uma biblioteca de web components que implementa o sistema de design Material 3 do Google. Componentes como botões, caixas de seleção, botões de opção, campos de texto e estilos tipográficos são publicados como custom elements padrão, podendo ser usados tanto em HTML puro quanto com React, Vue, Angular ou outros frameworks.

A biblioteca pode ser carregada diretamente de uma CDN com um import map, sem precisar de uma etapa de build, ou instalada pelo npm para builds de produção. Uma folha de estilos de escala tipográfica fornece estilos de texto do Material que podem ser aplicados a qualquer elemento.

O projeto está em modo de manutenção enquanto a equipe busca novos mantenedores, então as equipes que pretendem adotá-lo devem levar isso em conta.

Recursos principais

  • 01Componentes Material 3 publicados como web components padrão
  • 02Pode ser usado em HTML puro ou com React, Vue e Angular
  • 03Configuração sem build via CDN e import maps
  • 04Folha de estilos de escala tipográfica com estilos de texto do Material
  • 05Pode ser instalado pelo npm para builds de produção

Casos de uso

  • Adicionar botões, campos de texto e controles de formulário com estilo Material a uma página HTML estática
  • Criar a interface de um app web com Material 3 sem se comprometer com um framework específico
  • Prototipar interfaces Material rapidamente com uma importação de CDN

Início rápido

  1. 1

    Copie o exemplo de HTML sem etapa de build do README para um arquivo HTML

  2. 2

    Abra o arquivo HTML em um navegador para ver os componentes funcionando a partir do CDN

Antes de usar

  • O projeto está em modo de manutenção enquanto busca novos mantenedores

Em coleções

Frameworks frontend e componentes de interface

Tópicos

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

Perguntas frequentes

O que é material-web?
Web components do Material Design 3 baseados em Lit para criar apps acessíveis, com configuração sem build via CDN ou instalação pelo npm. Material Web (@material/web) é uma biblioteca de web components que implementa o sistema de design Material 3 do Google. Componentes como botões, caixas de seleção, botões de opção, campos de texto e estilos tipográficos são publicados como custom elements padrão, podendo ser usados tanto em HTML puro quanto com React, Vue, Angular ou outros frameworks.
material-web é gratuito? Qual é a licença?
material-web é open source sob a licença Apache-2.0. Confira os termos da licença antes de usá-lo em produtos comerciais.
material-web ainda é mantido?
Manutenção ativa. O último commit de material-web foi em 22 de out. de 2026.
Para que posso usar material-web?
Adicionar botões, campos de texto e controles de formulário com estilo Material a uma página HTML estática Criar a interface de um app web com Material 3 sem se comprometer com um framework específico Prototipar interfaces Material rapidamente com uma importação de CDN
Como instalar material-web?
Copie o exemplo de HTML sem etapa de build do README para um arquivo HTML Abra o arquivo HTML em um navegador para ver os componentes funcionando a partir do CDN
Onde consigo material-web?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/material-components/material-web

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados