main{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
grid-auto-rows:250px;
align-items: stretch;
grid-gap:5px;
font-size: 200%;
}
div:not([class]){height:0px;}
.g1{
	 background: #000000;
    background-image:
        repeating-radial-gradient(circle at 0.35em 0.15em, #000000, #000000 0.2em, transparent 0.21em, transparent 3em),
        repeating-radial-gradient(circle at 0.25em 0.25em, #CC3737, #CC3737 0.2em, transparent 0.21em, transparent 3em),
        repeating-radial-gradient(circle at 0.22em 0.28em, #000000, #000000 0.2em, transparent 0.21em, transparent 3em),
        repeating-radial-gradient(circle at 1.15em 0.95em, #000000, #000000 0.2em, transparent 0.21em, transparent 3em),
        repeating-radial-gradient(circle at 1.05em 1.05em, #CC3737, #CC3737 0.2em, transparent 0.21em, transparent 3em),
        repeating-radial-gradient(circle at 1.02em 1.08em, #000000, #000000 0.2em, transparent 0.21em, transparent 3em);
    background-size: 1.6em 1.6em;
    background-position: 1.17em 1.12em;
}

.g2{
	background:
	repeating-conic-gradient(#def 0 20deg, #7ac 0 40deg);
	background-size:100px 40px;
}

.g3{
	background: repeating-radial-gradient(circle, transparent, transparent 8.8px, #783433 8.8px, #783433 11.3px), repeating-radial-gradient(circle, transparent, transparent 8.8px, #783433 8.8px, #783433 11.3px), #ffffff;
    background-size: 50px 50px;
    background-position: 0 0, 25px 25px, 50px 25px;
    background-color: #ffffff;
}
.g4{
background-image:repeating-conic-gradient(red 0,cyan 12.5%,red 25%);
  background-size:50px 50px;
}
.g5{
background:repeating-conic-gradient(blue 0, yellow 5%, blue 10%);
  background-size:20px 400px;
  background-position:50% -150px;
}
.g6{
  background:
	repeating-conic-gradient(#def 0,#def 11.25deg, #7ac8 11.25deg, #7ac8 33.75deg, #def 33.75deg, #def 45deg);
	background-size:50px 50px;
}
.g7{
  background:
    conic-gradient(at 25% 50%,transparent 160deg, cyan 165deg, cyan 195deg, transparent 200deg), 
    radial-gradient(circle at 25% 0, cyan 9%, transparent 10%),
    radial-gradient(circle at 75% 50%, cyan 9%, transparent 10%),
    linear-gradient(transparent 50%, white 50%),
    conic-gradient(at 75% 0,white 160deg, cyan 165deg, cyan 195deg, white 200deg);
    background-size:100px 50px;
}
.g8{
background: repeating-linear-gradient(45deg, #000, #666, #000 20%), 
repeating-radial-gradient(circle, #ddd, magenta, #ddd 5%), 
repeating-conic-gradient(#ddd, magenta, #ddd 5%);
    background-blend-mode: screen, difference;
}