<div class="el"></div>
.el {
position: relative;
padding: 50px 100px;
border-radius: 15px;
background-image: linear-gradient(to right, green calc(100% - 70px), blue);
&::after {
content: '';
position: absolute;
top: 100%;
right: 0;
width: 100%;
height: 29px;
background-image: linear-gradient(to right, green calc(100% - 70px), blue);
clip-path: polygon(calc(100% - 108px) 0, calc(100% - 18px) 0, 100% 100%);
}
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.