Как сделать такой background и чтобы текст с картинкой не был сзади?

Question

[Dorten]

вот так вот

Comments

[Dorten]

я щас пробую использовать
background: linear-gradient(to right, #1F4E79 0%, #1F4E79 50%, #ddd 50%, #ddd 100%);
и как это по диагонали разместить

[todaystudio]

Для того, чтобы картинка была позади розового "цвета" я бы сделал следующее.
Во-первых, разделил бы этот background на две части, то есть, на два svg-объекта.
Во-вторых, с помощью абсолютного позиционирования и z-index'ов разместил бы их уже на странице.
Если информация в таком виде не помогла, то ответьте на этот коммент, я попробую помочь кодом)

[Ankhena]

background: linear-gradient(to right, #1F4E79 0%, #1F4E79 50%, #ddd 50%, #ddd 100%);
и как это по диагонали разместить

Диагональ это to right bottom и аналоги, а не to right

Но в макете у вас не диагональ, там какое-то скругление довольно странное и пока не ясно чем оправданное.
Делается с помощью просто svg или в сочетании с clip-path (и псевдо)

и чтобы текст с картинкой не был сзади?

Это не очень понятно.
Вообще провалиться под фон это нужно постараться.
Так что покажите в песочнице на codepen.io как это у вас получилось.