i'm struggling with CSS trying to create special shape.

This is the shape i wanna create

enter image description here

Do you have any solution ?

Thank's

CodePudding user response：

How about this:

div {
  position: relative;
  height: 300px;
  overflow: hidden;
  border-radius: 25px;
}

.bg {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: blue;
  transform: skewY(-6deg);
  transform-origin: top right;
  border-radius: 25px;

<div>
  <div ></div>
</div>