JSFiddle - React, Tailwind, and code Playground

by xawixawxaw

HTML

<div id="1">
    <svg>
        <g fill="none" class="svg-pan-zoom_viewport" transform="matrix(1.7872340425531914,0,0,1.7872340425531914,82.06382978723406,-8.936170212765944)">
          <g stroke="#000" fill="#FFF">
            <rect x="5" y="5" width="240" height="240" fill="url(#linear-gradient)"></rect>
            <path d="M 5 5  L 245 245 Z"></path>
          </g>
        </g>
    </svg>
</div>
<div id="2">
</div>

CSS

.svg-pan-zoom-control { cursor: pointer; fill: black; fill-opacity: 0.333; } .svg-pan-zoom-control:hover { fill-opacity: 0.8; } .svg-pan-zoom-control-background { fill: white; fill-opacity: 0.5; } .svg-pan-zoom-control-background { fill-opacity: 0.8; }