mdc-react/dist/badge/index.css

Material Components for the web implemented in React

.mdc-badge{display:inline-flex;flex-shrink:0;margin-right:20px;position:relative;vertical-align:middle;white-space:nowrap}.mdc-badge[data-badge]:after{align-content:center;align-items:center;background:#6200ee;border-radius:10px;box-sizing:border-box;color:#fff;content:attr(data-badge);display:flex;flex-direction:row;flex-wrap:wrap;font-family:Roboto,Helvetica,Arial,sans-serif;font-size:12px;font-weight:600;height:20px;justify-content:center;line-height:1;min-width:20px;padding:0 6px;position:absolute;right:0;top:0;transform:scale(1) translate(50%,-50%);transform-origin:100% 0;z-index:1}.mdc-badge.mdc-badge--inset:after{right:14%;top:14%}.mdc-badge.mdc-badge--transparent:after{background:transparent;color:#6200ee}