Как сделать блок с «оттянутой» стороной на css?

Question

[siroper]

Здравствуйте. Ищу пути решения на css, возможно js вот такого блока:


Важно на css т.к. сам блок будет иметь свойство overflow:hidden и элементы внутри него не смогут выходить за пределы этого блока, сам блок должен иметь "оттянутую" нижнюю часть "сисьской" и иметь border-radius..

Просмотрел все возможные transform и т.д. ничего подобного не могу найти.

Comments

[Ankhena]

Радиальным градиентом https://jsfiddle.net/Ankhena/x6y3hgt1/4/
Clip-path
Псевдо со скруглением и размером больше, чем элемент.

В последнем случае overflow можно применить к дочерней обертке

Answer 1

[Андрей Мартынкевич]

Такой результат Вам нужен?

Comments

[siroper]

В сторону border-radius уже смотрел, но с ним не возможно добиться нужного качества и скругления углов


А как нужно получить:

Answer 2

[Олег]

Как вариант можно сделать псевдо закругленный border градиентом

Comments

[siroper]

Нет, нам к этому блоку нужно будет применять overflow:hidden