html {
--s: 120px; /* the size */
--_c: #72e21f /* color 1 */ 25%,#0000 0;
--_g1: conic-gradient(at 62.5% 12.5%,var(--_c));
--_g2: conic-gradient(at 87.5% 62.5%,var(--_c));
--_g3: conic-gradient(at 25% 12.5%,var(--_c));
background:
var(--_g1) calc( var(--s)/-8) calc(var(--s)/2),var(--_g1) calc(-3*var(--s)/8) calc(var(--s)/4),
var(--_g2) calc(3*var(--s)/8) calc(var(--s)/4),var(--_g2) calc( var(--s)/-8) 0,
var(--_g3) 0 calc(var(--s)/-4),var(--_g3) calc(var(--s)/-4) 0,
conic-gradient(at 87.5% 87.5%,var(--_c)) calc(var(--s)/8) 0
#044012; /* color 2 */
background-size: var(--s) var(--s);
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.