JSFiddle - React, Tailwind, and code Playground
by genelocklin
HTML
<div class="you-know"></div>
CSS
.you-know {
display:block;
width: 96px;
height: 330px;
background-color: rgba(201, 195, 191, 1);
border-radius: 43px 43px 43px 43px / 78px 78px 32px 32px;
position: relative;
margin: 50px auto;
}
.you-know:before {
content: "";
position: absolute;
bottom: -15px;
left: 25px;
height: 120px;
width: 120px;
border-radius: 60px;
background: rgba(201, 195, 191, 1);
}
.you-know:after {
content: "";
position: absolute;
bottom: -15px;
right: 25px;
height: 120px;
width: 120px;
border-radius: 60px;
background: rgba(201, 195, 191, 1);
}