<div></div>
body {
display: grid;
place-items: center;
height: 100vh;
background: #333;
}
div {
width: 200px;
height: 300px;
position:relative;
}
div::before, div::after {
content: "";
height: 100%;
width: 90%;
background: #DA0037;
position: absolute;
border-radius: 200px 200px 0 0;
}
div::before{
left: -50px;
transform: rotate(-45deg);
}
div::after {
left: 35px;
transform: rotate(45deg);
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.