createCanvas(windowWidth, windowHeight);

  angleMode(DEGREES);

  radius = width / 30;

  radius2 = 20;

  frameRate(60);

  yinYang = new YinYang(0, 0, radius);

  yinYang2 = new YinYang(0, 0, radius2);

}

​

function draw() {

  background(30);

  translate(radius/2, radius/2);

    fill('#88e1f2')

    for (i = 100; i < height/(radius2*sin(60)); i++) {

      for (j = 0; j <= width / radius2 + 1; j++) {

        push();

        if(i%2==0) {

          translate(j*radius2, i*radius2*sin(60));

        } else {

          translate(-radius2/2 + j*radius2, i*radius2*sin(60))

        }

        rotate(-2*frameCount+j*width/radius2 +i);

        yinYang2.show()

        pop();

      }

    }

    fill('#C0FF4C');

    for (i = 0; i < height/(radius*sin(60)); i++) {

      for (j = 0; j <= width / radius; j++) {

        push();

        if(i%2==0) {

          translate(j*radius, i*radius*sin(60));

        } else {

          translate(-radius/2 + j*radius, i*radius*sin(60))

        }

        rotate(-2*frameCount+j*width/radius +i);

        yinYang.show()

        pop();

      }

    }

}