JSFiddle - React, Tailwind, and code Playground

by sqiudward

HTML

<svg width="100%" height="300px">
<defs>
<filter id="filter" x="-20%" y="-20%" width="140%" height="140%" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="linearRGB">
	<feDropShadow stdDeviation="5 0" in="blend" dx="7" dy="-9" flood-color="#1F3646" flood-opacity="0.2" x="0%" y="0%" width="100%" height="100%" result="dropShadow"/>
</filter>


</defs>


<path fill="#328800" stroke="#111111" d="M289.8024391856267,268.61513496225996L276.8237254218789,228.6707612778635A75,75,0,0,1,360.676274578121,255.9161060780645L326.6975608143733,280.6030866743484A33,33,0,0,0,289.8024391856267,268.61513496225996Z" opacity="1" stroke-width="0" id="wheelnav-home-slice-4" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); opacity: 1; cursor: default; fill-opacity: 1;" transform="matrix(1,0,0,1,0,0)" filter="url(#filter)" fill-opacity="1"><title style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></title></path>

</svg>