Repolode
Предложить
material-components

material-components/material-web

Веб-компоненты Material Design 3 на Lit для создания доступных веб-приложений: через CDN без сборки или из npm.

Открыть на GitHubСайт
Звёзды
11,369
Форки
1,158
Открытые issues
189
Последний коммит
3 дня назад

Что это?

Material Web (@material/web) — библиотека веб-компонентов, реализующих систему дизайна Google Material 3. Такие компоненты, как кнопки, флажки, переключатели, текстовые поля и стили типографики, доступны в виде стандартных пользовательских элементов, поэтому их можно использовать как в обычном HTML, так и с React, Vue, Angular и другими фреймворками.

Библиотеку можно подключить напрямую через CDN с помощью import map, без этапа сборки, или установить из npm для production-сборок. Таблица стилей typescale содержит стили типографики Material, которые можно применять к любым элементам.

Проект находится в режиме поддержки, пока команда ищет новых сопровождающих, поэтому при его внедрении стоит учитывать это обстоятельство.

Ключевые возможности

  • 01Компоненты Material 3 доступны в виде стандартных веб-компонентов
  • 02Можно использовать в обычном HTML или вместе с React, Vue и Angular
  • 03Настройка без сборки через CDN и import maps
  • 04Таблица стилей typescale со стилями типографики Material
  • 05Установка из npm для production-сборок

Сценарии использования

  • Добавление кнопок, текстовых полей и элементов управления формами в стиле Material на статическую HTML-страницу
  • Создание интерфейса веб-приложения на Material 3 без привязки к конкретному фреймворку
  • Быстрое прототипирование интерфейсов Material с помощью CDN

Быстрый старт

  1. 1

    Скопируйте пример HTML без сборки из README в HTML-файл

  2. 2

    Откройте HTML-файл в браузере, чтобы увидеть работающие компоненты, загруженные с CDN

Что важно знать

  • Проект находится в режиме сопровождения, пока для него ищут новых мейнтейнеров

В подборках

Фронтенд-фреймворки и UI-компоненты

Темы

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

Частые вопросы

Что такое material-web?
Веб-компоненты Material Design 3 на Lit для создания доступных веб-приложений: через CDN без сборки или из npm. Material Web (@material/web) — библиотека веб-компонентов, реализующих систему дизайна Google Material 3. Такие компоненты, как кнопки, флажки, переключатели, текстовые поля и стили типографики, доступны в виде стандартных пользовательских элементов, поэтому их можно использовать как в обычном HTML, так и с React, Vue, Angular и другими фреймворками.
material-web можно использовать бесплатно? Какая у него лицензия?
material-web распространяется с открытым исходным кодом под лицензией Apache-2.0. Перед использованием в коммерческих продуктах проверьте условия лицензии.
material-web всё ещё поддерживается?
Активно поддерживается. Последний коммит в material-web — 22 окт. 2026 г..
Для чего можно использовать material-web?
Добавление кнопок, текстовых полей и элементов управления формами в стиле Material на статическую HTML-страницу Создание интерфейса веб-приложения на Material 3 без привязки к конкретному фреймворку Быстрое прототипирование интерфейсов Material с помощью CDN
Как установить material-web?
Скопируйте пример HTML без сборки из README в HTML-файл Откройте HTML-файл в браузере, чтобы увидеть работающие компоненты, загруженные с CDN
Где скачать material-web?
Исходный код и инструкции по установке — на GitHub: https://github.com/material-components/material-web

Описание создано ИИ на основе README проекта. Статистика GitHub обновляется ежедневно.

Похожие проекты

padloc / padloc

Менеджер паролей и данных с открытым исходным кодом для частных пользователей и команд: сервер, веб-, десктопные и мобильные приложения, а также расширения для браузеров.

Безопасность#password-manager#end-to-end-encryption#typescript
2,9 тыс.+4 за неделю268JavaScriptAGPL-3.0Обновлён позавчера