Как сделать изогнутый фон на SVG?

Question

[dsgnfox]

Как сделать так, чтобы фон у блока был изогнутый?
На скрине примерная фигура, которая должна быть на фоне (черная полоса).

Пробовал вставлять inline svg - фигура масштабируется, а этого быть не должно.

<svg version="1.1" id="Слой_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 1920 800" preserveAspectRatio="meetOrSlice">
<path d="M0,517.5c0,0,720,55,960,55s960-55,960-55v-345c0,0-463,55-960,55c-481,0-960-55-960-55V517.5z"/>
</svg>

Пробовал svg через background-image, тоже не то.

Answer 1

[Максим]

можно просто здоровенный круг сделать , и весь svg вставить в div и overflow:hidden; и на фон его :codepen.io/Geyan/pen/eBKBez?editors=110

Comments

[dsgnfox]

. Shadow, хороший вариант. Попробую.

Answer 2

[Александр Филиппенко]

В inline svg нужно добавить аттрибуты width и height.
Либо в CSS можно задать.