Как сделать Background градиентом с четкой изогнутой линией между цветами?

Question

[Corepro]

Как сделать такой изогнутый градиент с линией по центру?

Comments

[Сергей delphinpro]

svg фоном поставьте, проще будет.

Answer 1

[Виталий Першин]

Comments

[Corepro]

Идеальный вариант.
Огромное спасибо

Answer 2

[nickejes]

Через transform: matrix(0.0.0); Если дизайн сайта производился в photoshop или figma то можно скопировать стили css с дизайна.

Answer 3

[Андрей Федоров]

https://codepen.io/aliencash/pen/MWQjagJ

Comments

[Сергей delphinpro]

на рисунке явно трапецевидная форма линии, а не окружность.

[Андрей Федоров]

Сергей delphinpro, ну вопрос-то не об этом. пусть тогда делает частями - 3 фона.

[ForSureN1]

Андрей Федоров, Да нет зачем, можно линию вытащить полностью, да абсолютом поставить, через bottom подогнать пиксели и все

[Андрей Федоров]

ForSureN1, задача - сделать через background, т.ч. никакого абсолюта и bottom быть не может.

[ForSureN1]

Андрей Федоров, ну с чего вы взяли что быть не может, это ведь обычный декоративный элемент, который навряд ли как то может измениться, поэтому думаю что автор просто не с той стороны подходит к решению задачи

[Андрей Федоров]

ForSureN1, ваша задача решить как он хочет, а не фантазировать. ) мало ли зачем ему это надо... а если не можете помочь, так хоть не осуждайте.

[ForSureN1]

Андрей Федоров, Где вы увидели в моих словах осуждения :D Я просто предложил альтернативный вариант решения задачи, и не более )
P.S. и это не биржа фриланса, на секундочку, задача данного сайта в помощи решения задачи, а не предоставления готового решения, которого хочет автор :)