JSFiddle - React, Tailwind, and code Playground

HTML

<svg display="none" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<symbol id="icon-cart" viewBox="0 0 1024 1024">
	<title>cart</title>
	<path class="path1" d="M384 928c0 53.019-42.981 96-96 96s-96-42.981-96-96c0-53.019 42.981-96 96-96s96 42.981 96 96z"></path>
	<path class="path2" d="M1024 928c0 53.019-42.981 96-96 96s-96-42.981-96-96c0-53.019 42.981-96 96-96s96 42.981 96 96z"></path>
	<path class="path3" d="M1024 512v-384h-768c0-35.346-28.654-64-64-64h-192v64h128l48.074 412.054c-29.294 23.458-48.074 59.5-48.074 99.946 0 70.696 57.308 128 128 128h768v-64h-768c-35.346 0-64-28.654-64-64 0-0.218 0.014-0.436 0.016-0.656l831.984-127.344z"></path>
</symbol>
</defs>
</svg>
<svg class="icon icon-cart"><use xlink:href="#icon-cart"></use></svg>

CSS

.icon-cart {
    height: 16px;
    width: 20px;
}
.icon {
    display: inline-block;
    fill: currentcolor;
    color: #808080;
}