README

<p align="center"> <a href="https://www.mdui.org/"> <img src="https://raw.githubusercontent.com/zdhxiong/mdui/953011ce2911e2e64b6cb242729df82664f6a78a/packages/jetbrains-plugin/src/main/resources/META-INF/pluginIcon.svg" alt="mdui logo" width="165" height="165"/> </a> </p> <h1 align="center">mdui</h1> <p align="center"> A Material Design 3 (Material You) library of Web Components. <br/> <a href="https://www.mdui.org"><strong>https://www.mdui.org</strong></a> <br/>

I am developing mdui v3 based on the M3 Expressive specification. You can follow the mdui v3 development progress here. During this period, mdui v2 will continue to be updated for bug fixes and new features.

🧩 Works with all frameworks
🚛 Works with CDNs
🏙️ Material 3 design system
🌛 Includes dark theme and dynamic color
🆚 Optimized for WebStorm and VSCode
😸 Open source

Docs

Installation

npm install mdui --save

Usage

Import CSS and JS:

import 'mdui/mdui.css';
import 'mdui';

Use the component:

<mdui-button>Button</mdui-button>

Using CDN

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="https://unpkg.com/mdui@2/mdui.css" />
    <script src="https://unpkg.com/mdui@2/mdui.global.js"></script>
  </head>
  <body>
    <mdui-button>Hello, world!</mdui-button>
  </body>
</html>

License

MIT

Mdui

Install / Use