var cwidth = 300;

var cheight = 300;

​

function setup() {

  createCanvas(cwidth, cheight);

}

​

function draw() {

  background(220);

  // Set rectangle width and height

  var x = cwidth/8;

  var y = cheight/8;

  // Center Triangle

  var t = 2.718;

  triangle(cwidth/2-x*t,cheight/2+y*1.45,cwidth/2+x*t,cheight/2+y*1.45,cwidth/2,cheight/2-y*t);

  // Circles that will surround the Rectangles(squares)

  ellipse(x/2,y/2,x*1.45,y*1.45); // top-left

  ellipse(cwidth-x/2,y/2,x*1.45,y*1.45); // top-right

  ellipse(x/2,cheight-y/2,x*1.45,y*1.45); // bottom-left

  ellipse(cwidth-x/2,cheight-y/2,x*1.45,y*1.45); // bottom-right

  ellipse(cwidth/2,cheight/2,x*2.9,y*2.9); // center

  // Corner Rectangles

  rect(0,0,x,y); // top-left

  rect(cwidth-x,0,x,y); // top-right

  rect(0,cheight-y,x,y); // bottom-left

  rect(cwidth-x,cheight-y,x,y); // bottome-right

  // Center Rectangles

  rect(cwidth/2-x,cheight/2-y,x,y); //top-left

  rect(cwidth/2,cheight/2-y,x,y); // top-right

  rect(cwidth/2-x,cheight/2,x,y); // bottom-left

  rect(cwidth/2,cheight/2,x,y); // bottom-right

  // Circles inside the rectangles

  ellipse(x/2,y/2,x,y); // top-left

  ellipse(x/2,y/2,x/2,y/2); // top-left

  ellipse(cwidth-x/2,y/2,x,y); // top-right

  ellipse(cwidth-x/2,y/2,x/2,y/2); // top-right

  ellipse(x/2,cheight-y/2,x,y); // bottom-left

  ellipse(x/2,cheight-y/2,x/2,y/2); // bottom-left

  ellipse(cwidth-x/2,cheight-y/2,x,y); // bottom-right

  ellipse(cwidth-x/2,cheight-y/2,x/2,y/2); // bottom-right

  ellipse(cwidth/2,cheight/2,x,y); // center

    ellipse(cwidth/2,cheight/2,x/2,y/2); // center

}