JSFiddle - React, Tailwind, and code Playground

HTML

<meter max="100" value="78">This should show a styled meter</meter>

CSS

meter::-webkit-meter-bar {
    background: -webkit-gradient(linear, left top, left bottom, from(#aaa), to(#aaa), color-stop(0.20, #eee), color-stop(0.45, #ccc), color-stop(0.55, #ccc));
}

meter::-webkit-meter-optimum-value {
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff), color-stop(0.20, #cea), color-stop(0.45, #7a3), color-stop(0.55, #006));
}

meter::-webkit-meter-suboptimum-value {
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff), color-stop(0.20, #ffc), color-stop(0.45, #db3), color-stop(0.55, #006));
}

meter::-webkit-meter-even-less-good-value {
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff), color-stop(0.20, #fcc), color-stop(0.45, #d44), color-stop(0.55, #006));
}