JSFiddle - React, Tailwind, and code Playground

HTML

<svg version="1.1"
	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
	 x="0px" y="0px" width="142px" height="71px" viewBox="157.4 85.7 142 71"
	 overflow="visible" enable-background="new 157.4 85.7 142 71" xml:space="preserve">
<defs>
</defs>
<path opacity="0.4" fill="#FFFFFF" d="M254.7,124.4c0,0-4.7-9.6-20-13v28.7l13.2,11c2.3-0.5,4.6-1.1,6.8-1.7V124.4z"/>
<g>
	<defs>
		<path class="path" id="SVGID_3_" d="M265.5,94.5c-11.5,7.9-27.7,9-41.2,8.4c-15.6-0.6-26.8-7.2-40.9-11.6c-12.5-3.9-25,2.1-21.2,17.1
			c3.5,13.7,11.1,26.2,23.4,33.6c25.9,15.5,72,15.5,94.5-6.9c8.5-8.4,19.9-27.4,12.8-39.8C287.3,85.7,273.2,90.6,265.5,94.5
			C252.5,103.5,265.5,94.5,265.5,94.5z"/>
	</defs>
	<clipPath class="clip-path" id="SVGID_1_">
		<use xlink:href="#SVGID_3_"  overflow="visible"/>
	</clipPath>
  
  <g transform="matrix(1 0 0 1 3.814697e-06 1.907349e-06)" clip-path="url(#SVGID_1_)">
  <image class="rotation" overflow="visible" width="506" height="267" ...