​

let rand1 = 0;

let rand2 = 0;

let rand3 = 0;

let rand4 = 0;

let rand5 = 0;

let rand6 = 0;

let rand7 = 0;

let rand8 = 0;

let rand9 = 0;

let rand10 = 0;

let rand11 = 0;

let rand12 = 0;

​

function setup() {

  createCanvas(1920, 1080);

  blendMode(ADD)  

  for(i = 0; i < 300; i ++){

   shapes[i] = new Shape(rand1, rand2, rand3, rand4, rand5, rand6, rand7, rand8, rand9, rand10, rand11, rand12);

    rand1 = random(width);   

    rand2 = random(width);

    rand3 = random(width);   

    rand4 = random(width);

    rand5 = random(height);   

    rand6 = random(height);

    rand7 = random(height);   

    rand8 = random(height);

    rand9 = random(150);

    rand10 = random(50);

    rand11 = random(15);

    rand12 = random(100);

  }

}

​

function draw() {

  background(rand11, rand10, rand9);

  noFill();

    for(i = 0; i < shapes.length; i ++){

      //shapes[i].move();

      shapes[i].show();

  }

  noLoop();

}

​

class Shape {

  constructor(x1, x2, x3, x4, y1, y2, y3, y4, r, g, b, a, shape) {

    this.x1 = x1;

    this.x2 = x2;

    this.x3 = x3;

    this.x4 = x4;

    this.y1 = y1;

    this.y2 = y2;

    this.y3 = y3;

    this.y4 = y4;

    this.r = r;

    this.g = g;

    this.b = b;

    this.a = a;

    this.shape = shape;

  }

​

  move() {

    this.x1 = this.x1 + random(-2, 2);

    this.y1 = this.y1 + random(-2, 2);

    this.x2 = this.x2 + random(-2, 2);

    this.y2 = this.y2 + random(-2, 2);

    this.x3 = this.x3 + random(-2, 2);

    this.y3 = this.y3 + random(-2, 2);

    this.x4 = this.x4 + random(-2, 2);

    this.y4 = this.y4 + random(-2, 2);

  }

  show() {

    strokeWeight(4);

    stroke(this.r + 10, this.g + 10, this.b + 10, 0)

    fill(this.r, this.g, this.b, this.a);

    quad(this.x1, this.y1, this.x2, this.y2, this.x3, this.y3, this.x4, this.y4);

  }

​

}