@react-md/badge

Create a badge that is fixed to another element. This is generally used for notification counts.

Usage no npm install needed!

<script type="module">
  import reactMdBadge from 'https://cdn.skypack.dev/@react-md/badge';
</script>

README

@react-md/badge

A badge is a floating element that is normally fixed to another element to add additional information. The biggest use-case for a badge is to show a count of notifications.

Installation

npm install --save @react-md/badge

If you would also like dynamic themes and general typography, it is recommended to also install:

npm install --save @react-md/theme \
  @react-md/typography

Documentation

You should check out the full documentation for live examples and more customization information, but an example usage is shown below.

Usage

import { render } from "react-dom";
import { BadgedButton } from "@react-md/badge";

const App = () => <BadgedButton id="notifications">3</BadgedButton>;

render(<App />, document.getElementById("root"));