​

function setup() {

  createCanvas(400, 400);

  print("see also https://editor.p5js.org/kll/sketches/BJYFW_hTQ ");

}

​

function draw() {

  background(200, 200, 0);

  translate(width / 2, height / 2);

  strokeWeight(20);

  stroke(0, 0, 0);

  fill(0, 200, 0);

  draw_curverect(120);

  fill(200, 0, 0);

  draw_curverect(60);

}

​

function draw_curverect(w) {

  beginShape();

  curveVertex(-w, w);   // point 4 // not drawn control point defines correct angle

  curveVertex(-w, -w);  // point 1

  curveVertex(w, -w);   // point 2

  curveVertex(w, w);    // point 3

  curveVertex(-w, w);   // point 4

  curveVertex(-w, -w);  // point 1 // close the loop

  curveVertex(w, -w);   // point 2 // not drawn control point defines correct angle

  endShape();

}