JSFiddle - React, Tailwind, and code Playground

by RĂ´mulo Bastos

HTML

<div></div>

CSS

div{
  background: rgb(102,45,145);
  background: linear-gradient(-45deg, rgba(102,45,145,1) 0%, rgba(0,114,188,1) 100%);
  width:100vw;
  height:30vw;
  position:relative;
  overflow: hidden;
}
div::after{
  content: '';
  background:white;
  position: absolute;
  width: 200vw;
  height: 40vw;
  left: -15vw;
  bottom: -30vw;
  border-top-left-radius:100%;
  border-top-right-radius:100%;
}