JSFiddle - React, Tailwind, and code Playground

by NickU

HTML

<div class=draft></div>

CSS

.draft
{
    height: 24px;
    width: 24px;
    background-size: 16px 16px;
    margin-right: 2px;
    margin-top: 0px;
    color: steelblue;
    background: url("data:image/svg+xml,%3Csvg width='24' height='24' fill='none' viewBox='0 2 23 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.939 5 19 10.06 9.062 20a2.25 2.25 0 0 1-1 .58l-5.115 1.395a.75.75 0 0 1-.92-.921l1.394-5.116a2.25 2.25 0 0 1 .58-.999L13.94 5Zm-7.414 6-1.5 1.5H2.75a.75.75 0 0 1 0-1.5h3.775Zm14.352-8.174.153.144.145.153a3.579 3.579 0 0 1-.145 4.908L20.06 9l-5.061-5.06.97-.97a3.579 3.579 0 0 1 4.908-.144ZM10.525 7l-1.5 1.5H2.75a.75.75 0 1 1 0-1.5h7.775Zm4-4-1.5 1.5H2.75a.75.75 0 1 1 0-1.5h11.775Z' fill='%23212121'/%3E%3C/svg%3E") no-repeat top left;
    opacity: 0.4;
    white-space: nowrap;
    display: inline-block;
    vertical-align: middle;
}