Klien Blue, White Cross

let center;

let kleinBlue;

let a = 1.0, b = 1.0, c = 1.0, d = 1.0; //insets

let ds = 100; //scale of insets

​

let gamma; // cyclic parameter

let framesPerCycle = 2000;

let gammaIncrement;

​

function setup() {

  createCanvas(1000, 1000);

  colorMode(HSB, 360, 100, 100,100); 

  kleinBlue = color(241, 54, 58,1);

  fill(kleinBlue);

  noStroke();

  gamma = 0.0;

  gammaIncrement = TWO_PI / framesPerCycle;

}

​

function draw() {

  crossPoint = createVector(random(width), random(width));

  cross(crossPoint,10)

  gamma += gammaIncrement;

  translate(200 + 100 * random(),100 + 100 * random() )

  scale(random())

  rotate( HALF_PI * random())

  a = 1.0 + cos(gamma);

  b = 1.0 + sin(gamma);

  c = 1.0 + cos(-gamma + HALF_PI);

  d = 1.0 + sin(-gamma + HALF_PI);

  //background(0, 0, 100);

  fill(kleinBlue);

  rect(0 + a * ds, 0 + b * ds, width - (a + c) * ds, height - (b + d) * ds);

}

​

function cross(crossPoint, thickness) {

  strokeWeight(thickness);

  stroke(0, 0, 100);

  line(0, crossPoint.y, width, crossPoint.y);

  line(crossPoint.x, 0, crossPoint.x, width);

}