Как сделать такую фигуру?

Question

[Пётр]

Как через css задать стили, что бы div элемент принял такую форму?

Answer 1

[Ivan Bogachev]

Just Do It!

Вообще идея использовать clip-path - это хорошая идея, ноо... если фон у вас и правда белый....
(размеры взял из головы, не в них смысл)

.test {
    margin: 100px;
    height: 200px;
    width:  600px;
    transform: perspective(600px) rotateY(45deg);
    border-top-left-radius:    50px 100px;
    border-bottom-left-radius: 50px 100px;
    overflow: hidden;
    background: #000;
}

.test::after {
    background: #fff;
    content: '';
    display: block;
    height: 120%;
    width: 30%;
    transform: translateX(75%) translateY(-10%);
    float: right;
    border-radius: 50%;
}

CodePen

Comments

[Пётр]

Спасибо

Answer 2

[Конан Варвар]

clip-path :)
bennettfeely.com/clippy
https://www.sarasoueidan.com/blog/css-svg-clipping/

Comments

[Пётр]

Спасибо. Как вариант пойдет.