SVG Фон неправильно масштабируется

Question

Поэтому я пытаюсь сделать так, чтобы моя веб-страница имела двухцветный вид, с одной стороны ровной, а с другой - с радиальным градиентом.

В настоящее время я пытался сделать этов SVG, и это ужасно провалилось, но я не совсем уверен, как получить треугольник, который идет из верхнего левого, нижнего левого и верхнего правого края страницы, а также масштабируется до размера браузера.

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

Эта фотография была сделана мной в эскизе, но я новичок в веб-интерфейсе, и я только что испытывал трудности с получением цвета углов.

Я могу получить всеиначе, если бы я мог просто получить фон, чтобы сделать это: c

Answer 1

Не нужно SVG, вы можете сделать это с помощью CSS и множественного фона:

body {
  margin:0;
  height:100vh;
  
  background:
    linear-gradient(to bottom right,transparent 49.8%,grey 50%),
    radial-gradient(circle at top,yellow,black);
}