如何在 CSS 中创建这种高级形状？

【问题标题】：How can i create this advanced shape in CSS?如何在 CSS 中创建这种高级形状？
【发布时间】：2021-05-19 20:38:16
【问题描述】：

我想使用纯 CSS 或任何工具在下面的示例中创建相同的 orange 形状，我尝试了 clip-path 和一些 SVG 生成器，但我做不到。

请帮忙！！

Example

【问题讨论】：

stackoverflow.com/a/51086332/8620333
请描述你到目前为止所做的事情

标签： css animation svg

【解决方案1】：

这是一个带有形状的 SVG 路径示例：

<svg width="300" height="200">
  <path d="M 0,0 H 180 Q 200,0 210,17.32 
  L 280,138.56 Q 300,173.2 270,173.2 H 0 V 0 Z" fill="orange" stroke="none" />
</svg>

【讨论】：