createCanvas(400, 400);

  dens = 5;

  dots = [];

  time1 = 0;

  time2 = 2;

  time3 = 4;

  tup = 0.01;

  zoom = 100;

  for(x = 0; x < width / dens; x++){

    for(y = 0; y < height / dens; y++){

      dots[dots.length] = new Dot(x * dens, y * dens, dots.length);

    }

  }

  colorMode(RGB, 100);

  background(0);

}

​

function draw() {

  time1 = time1 + tup;

  time2 = time2 + tup;

  time3 = time3 + tup;

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

    dots[i].update();

  }

}

​

class Dot{

  constructor(x, y, index){

    this.pos = createVector(x, y);

    this.index = index;

    this.r = 0;

    this.g = 0;

    this.b = 0;

  }

  update(){

    this.r = map(noise(this.pos.x / zoom + sin(this.pos.y / 50 + time1), this.pos.y / zoom, time1), 0, 1, 0, 100);

    this.g = map(noise(this.pos.x / zoom, this.pos.y / zoom + sin(this.pos.x / 50 + time2), time2), 0, 1, 0, 100);

    this.b = map(noise(this.pos.x / zoom + sin(this.pos.y / 50 + time3), this.pos.y / zoom + sin(this.pos.x / 50 + time3), time3), 0, 1, 0, 100);

    this.col = color(this.r, this.g, this.b);

    fill(this.col);

    noStroke();

    square(this.pos.x, this.pos.y, dens - 1);

  }

}