JSFiddle - React, Tailwind, and code Playground
HTML
<div id="bell"></div>
CSS
#bell {
left:300px;
position: relative;
background-color: yellow;
}
#bell:before, #bell:after {
position: absolute;
content: "";
left: 50px; top: 0;
width: 180px;
height:400px;
background: #d3d3d3;
border-radius: 150px 150px 150px 20px;
-webkit-transform: rotate(15deg);
-webkit-transform-origin: 0 0;
}
#bell:after {
left: 0;
-webkit-transform: rotate(-15deg);
-webkit-transform-origin:100% 0;
border-radius: 150px 150px 20px 150px;
}