在CSS中创建弯曲的三角形弧

是否有可能用CSS创建一个弯曲的弧形三角形的东西？ (看看蓝色区域).

我可以用一个白色的椭圆形div创建这个效果,另一个div坐在它上面是蓝色,所以它给出了弧形的错觉.然而这并不好,因为我需要弧形所在的透明度,而不是白色椭圆形所阻挡的白色区域.

我想要创建整个或者一半我可以彼此相邻设置以构成一个整体.

在此,设置border-radius 50％使其成为椭圆形,并添加一个向上的阴影将获得您的形状.

基本元素需要隐藏溢出以将阴影保持在矩形内

div {  background-image: linear-gradient(black, black);  background-size: 100% 30px;  background-repeat: no-repeat;  height: 30px;  position: relative;  overflow: hidden;  padding-bottom: 80px;}div::after {  content: '';  height: 160px;  width: 100%;  position: absolute;  border-radius: 50%;  box-shadow: 0px -80px 0px 100px blue;  top: 30px;  z-index: -1;}