let j = 0;

​

function setup() {

  createCanvas(900, 900);

  center = createVector(width / 2, height / 2);

  cols = ["#011627","#fdfffc","#2ec4b6","#e71d36","#FFE453","#002642","#F389B6","#E54400","#e5dada","#02040f"];

  rings = [];

  count = 12;

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

    curves[i] = new Curve(curves.length);

  }

  noFill();

  strokeWeight(0.1);

  background(255);

}

​

function draw() {

  for(j = 0; j < curves.length; j++){

    curves[j].update();

  }

}

​

class Curve {

  constructor(index){

    this.index = index;

    this.a1 = createVector(0, 0);

    this.a2 = createVector(0, 0);

    this.c1 = createVector(0, 0);

    this.c2 = createVector(0, 0);

    this.col = color(cols[this.index % cols.length]);

  }

  update(){

    stroke(this.col);

    this.c1 = (sin(frameCount / 1000 + this.index));

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

      this.sp.setHeading(TWO_PI / count * i + this.offset + (sin(this.sp.mag() * 0.01 + frameCount * 0.0001)));

      this.pos = p5.Vector.add(this.sp, center);

      circle(this.pos.x, this.pos.y, this.sp.mag());

    }

  }

}