<div class="box"></div>
.box {
width: 200px;
display: inline-block;
aspect-ratio: 1.5;
border: 1px solid;
background:
radial-gradient(40px at 0 40px,#0000 calc(98% - 10px),red calc(100% - 10px) 98%,#0000) 0 ;
transition: .5s;
}
.box:hover {
background:
radial-gradient(40px at 0 40px,#0000 calc(98% - 10px),red calc(100% - 10px) 98%,#0000) 0 -40px;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.