JSFiddle - React, Tailwind, and code Playground
HTML
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="1142.000000pt" height="437.000000pt" viewBox="0 0 1142.000000 437.000000"
preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,437.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M10 3103 c0 -843 4 -1298 11 -1358 14 -121 70 -287 133 -393 68 -115
219 -269 335 -340 85 -52 204 -100 321 -130 60 -15 457 -17 4920 -22 4580 -5
4859 -6 4919 -23 381 -104 657 -388 741 -761 18 -80 18 -41 19 2107 l1 2187
-5700 0 -5700 0 0 -1267z"/>
</g>
</svg>
<div>
</div>
CSS
body {
padding:0;
}
svg {
filter: drop-shadow(0px 26px 18px black);
}
div {
width: 1519px;
height: 400px;
background: blue;
margin-top: -240px;
}