JSFiddle - React, Tailwind, and code Playground

by Aleksey Karagodnikov

HTML

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Слой_1" x="0px" y="0px" width="57px" height="62px" viewBox="0 0 57 62" style="enable-background:new 0 0 57 62;" xml:space="preserve" xmlns:xml="http://www.w3.org/XML/1998/namespace">
    <rect x="16.52" y="20.29" transform="matrix(0.8694 0.4941 -0.4941 0.8694 17.3966 -4.6614)" width="2" height="20.56" />
    <rect x="28.45" y="18.69" transform="matrix(0.7637 -0.6455 0.6455 0.7637 -10.5446 25.4179)" width="2" height="16.86" />
    <rect x="32.18" y="14.94" transform="matrix(0.2676 -0.9635 0.9635 0.2676 2.3109 48.6851)" width="2" height="15.76" />
    <polygon points="20.94,14.97 14,19.5 14,52.5 20.2,55.93 19.8,55.01 15,49.42 15,25.42 21.38,19.75 21.38,15.89 " />
    <g>
        <path d="M20,24v24l-3,1.21V24.96L20,24 M21,22.64l-1.3,0.41l-3,0.95L16,24.23v0.73v24.25v1.48l1.37-0.55l3-1.21L21,48.68V48V24   V22.64L21,22.64z" />
    </g>
    <path class="st0" d="M22.5,48.67" />
    <path class="st0" d="M22.5,23.46" />
    <polyline class="st0" points="20.97,15.48 29.1,14.13 29.31,18.04 22.56,23.46 22.56,48.29 27.93,52.04 20,55.47 " />
    <line class="st0" x1="20.63" y1="19.4" x2="29.5" y2="17.83" />
    <ellipse transform="matrix(0.904 -0.4275 0.4275 0.904 -6.5904 12.1902)" cx="23.85" cy="20.77" rx="3.07" ry="1.07" />
</svg>

CSS

.st0 {
    fill:none;
    stroke:#000000;
    stroke-miterlimit:10;
}