Как мне заполнить другую часть этого SVG другим цветом, чтобы он гармонировал с моим дизайном?

Question

Как мне заполнить другую часть этого SVG другим цветом, чтобы он гармонировал с моим дизайном? Я хочу заполнить белую часть тем же серым цветом, что и над изогнутым svg, возможно ли это и как мне этого добиться?

Вот svg:

    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 160 1440 100"><path fill="#F43C58" fill-opacity="1" d="M0,160L80,181.3C160,203,320,245,480,240C640,235,800,181,960,165.3C1120,149,1280,171,1360,181.3L1440,192L1440,320L1360,320C1280,320,1120,320,960,320C800,320,640,320,480,320C320,320,160,320,80,320L0,320Z" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#F43C58;"></path></svg>

Answer 1

Вы можете присвоить SVG цвет фона:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 160 1440 100" style="background: #ecf0f3;"><path fill="#F43C58" fill-opacity="1" d="M0,160L80,181.3C160,203,320,245,480,240C640,235,800,181,960,165.3C1120,149,1280,171,1360,181.3L1440,192L1440,320L1360,320C1280,320,1120,320,960,320C800,320,640,320,480,320C320,320,160,320,80,320L0,320Z" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#F43C58;background: #000;"></path></svg>

Answer 2

Здесь:

 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 160 1440 100" viewport-fill="blue" style='stroke-width: 0px; background-color: blue;'><path fill="#F43C58" fill-opacity="1" d="M0,160L80,181.3C160,203,320,245,480,240C640,235,800,181,960,165.3C1120,149,1280,171,1360,181.3L1440,192L1440,320L1360,320C1280,320,1120,320,960,320C800,320,640,320,480,320C320,320,160,320,80,320L0,320Z" data-darkreader-inline-fill="" style="--darkreader-inline-fill:#F43C58;" ></path></svg>

, чтобы залить фон цветом blue.