Как сделать такой изогнутый блок?
Источник: Stack Overflow на русском
Вариант решения с SVG
, не очень точный но можно доработать.
<svg viewBox="-9.232 85.613 1040 580" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient gradientUnits="userSpaceOnUse" x1="510.768" y1="687.087" x2="510.768" y2="1267.871" id="gradient-0" gradientTransform="matrix(0, -1.807222, 1.807222, 0, -1255.486033, 1235.110107)">
<stop offset="0" style="stop-color: rgb(222, 177, 66);"></stop>
<stop offset="0.458" style="stop-color: rgb(240, 222, 141);"></stop>
<stop offset="0.695" style="stop-color: rgb(239, 218, 134);"></stop>
<stop offset="1" style="stop-color: rgb(236, 201, 103);"></stop>
</linearGradient>
</defs>
<path d="M 510.768 648.443 C 316.093 649.781 119.26 656.138 59.591 666.005 C 21.576 666.005 -9.242 635.187 -9.242 597.172 C -7.744 547.169 -6.445 459.665 -5.902 375.613 C -6.445 291.561 -7.744 204.057 -9.242 154.054 C -9.242 116.039 21.576 85.221 59.591 85.221 C 119.26 95.088 316.093 101.445 510.768 102.783 C 705.443 101.445 902.276 95.088 961.945 85.221 C 999.96 85.221 1030.778 116.039 1030.778 154.054 C 1029.28 204.057 1027.981 291.561 1027.438 375.613 C 1027.981 459.665 1029.28 547.169 1030.778 597.172 C 1030.778 635.187 999.96 666.005 961.945 666.005 C 902.276 656.138 705.443 649.781 510.768 648.443 Z" style="fill: url(#gradient-0);"></path>
</svg>