<p>Pure CSS background pattern. Can you figure out how it was made before checking the code?</p>

$d: 6.25em;
$o: .5*$d;
$l: .375em;
$y: .2*$d;

html {
  --l: #ef2d56, #ed7d3a, #ef2d56 25%, transparent 0%;
  --g0: 
    radial-gradient(50% 50% at 50% 100%, 
        transparent calc(100% - #{$l} + -1px), 
        #8cd867 calc(100% - #{$l}), #2fbf71 100%, 
        transparent calc(100% + 1px));
  --g1: conic-gradient(from -45deg at 50% #{$y}, var(--l));
  --g2: conic-gradient(from 135deg at 50% #{$d - $y}, var(--l));
  --p1: #{$o $l + $y};
  --p2: #{0 $o + $l + $y};
  background: 
    var(--g2) var(--p2), 
    var(--g1) var(--p2), 
    var(--g2) var(--p1), 
    var(--g1) var(--p1), 
    var(--g0), 
    var(--g0) $o $o #363537;
  background-size: $d $d
}