Css рисунок - пользовательская форма носа

Question

Я начинаю с чистого рисунка и анимации CSS, и я застрял в создании формы носа коалы.

Коала

Я знаю клип-путь может быть использован для достижения этой цели, но как я могу сделать Firefox-совместимым?.

Answer 1

Вероятно, есть много возможностей, но попробуйте радиус границы

.nose{
  border-radius:50px 50px 50px 50px / 100px 100px 50px 50px;
  width:70px;
  height:100px;
  background: red;
}

<div class="nose"></div>