<p>Pure CSS background pattern. Can you figure out how it was made before checking the code? Can you reduce the number of gradients? Let me know!</p>

$d: 8em;
$p0: 27%;
$p1: 53%;
$p2: 35%;
$l: .0625*$d;

html {
	--l: #{$p1}, transparent calc(#{$p1} + 1px);
	--g0: radial-gradient(#000 #{$p0}, #fff calc(#{$p0} + 1px) var(--l));
	--g1: radial-gradient(#fff #{$p2}, transparent calc(#{$p2} + 1px));
	--g2: radial-gradient(#ffe313 calc(#{$p1} + -1*#{$l}), #000 calc(#{$p1} + -1*#{$l} + 1px) var(--l));
	background: 
		var(--g2), var(--g2) .5*$d .5*$d, 
		var(--g1) .5*$d 0, var(--g1) 0 .5*$d, 
		var(--g0), var(--g0) .5*$d .5*$d;
	background-size: $d $d;
	background-blend-mode: darken, darken, difference, difference
}

/* absolutely no JS 🙃 */