Divide the body into 4 parts of different colors

Question

It would be possible to get the result of the image below using only Css in the body?

Obs: Unused divs

As much as I could:

body{ 
  background: linear-gradient( to right, red 25%, green 25%, green 70%, yellow 70%, yellow 80%, blue 80%, blue );
}

Answer 1

Option 1

4 backgrounds with 1/4 screen size and aligned each on a cando with background-position

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}
body {
    background-image:
                    linear-gradient(#f00 0, #f00 100%),
                    linear-gradient(#ff0 0, #ff0 100%),
                    linear-gradient(#0f0 0, #0f0 100%),
                    linear-gradient(#00f 0, #00f 100%);
    background-size: 50% 50%;
    background-position: top left, top right, bottom right, bottom left;
    background-repeat: no-repeat;
}

---

Option 2

Exactly with these colors I could not because of the blend-mode of the colors... but I was able to arrive at a very close result...

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}
body {
    background:
    linear-gradient(to bottom, #f00 0, #f00 50%, transparent 50%, transparent 100%),
    linear-gradient(to right, #00f 0, #00f 50%, #ff0 50%, #ff0 100%);
    background-size: 100% 100%, 100% 100%;
        background-blend-mode: difference;
}