Material Design 3 React

md3tail is an open source plugin based on tailwindcss. It's built with Material Design 3 and has the MIT license so you can use it included in a commercial project.

The md3tail/react library is a wrapper around Lit web components that implement Material Design UI elements.

Demo

Link to demo: https://md3tail.vercel.app

Installation

Install the package:

npm i @md3tail/react

Usage

import {
  TextButton,
  Radio,
  Row,
} from "@md3tail/react";

export default function Page() {
  return (
    <Row className="w-full" items="center">
      <TextButton>
        <Icon slot="icon">favorite</Icon>
        <span>Icon</span>
      </TextButton>
    </Row>
  );
}

Sources

Figma Material Design 3 Material Web