O código usado como base para o estudo cria gradientes radiais, isso é, circulos com cores que mudam quanto mais se aproximam ou afastam do centro de maneira uniforme.

int dim;

void setup() {
  size(640, 360);
  dim = width/2;
  background(0);
  colorMode(HSB, 360, 100, 100);
  noStroke();
  ellipseMode(RADIUS);
  frameRate(1);
}

void draw() {
  background(0);
  for (int x = 0; x <= width; x+=dim) {
    drawGradient(x, height/2);
  } 
}

void drawGradient(float x, float y) {
  int radius = dim/2;
  float h = random(0, 360);
  for (int r = radius; r > 0; --r) {
    fill(h, 90, 90);
    ellipse(x, y, r, r);
    h = (h + 1) % 360;
  }
}

Esse código cria um circulo e dois semi-círculos na tela, com as cores mudando completamente de maneira randomizada. Mudando o código para:

int dim;

float h;

void setup() {

  size(640, 360);

  dim = width/4;

  background(0);

  colorMode(HSB, 360, 100, 100);

  noStroke();

  ellipseMode(RADIUS);

  frameRate(60);

}

void draw() {

  background(0);

  for (int x = 0; x <= width; x+=dim) {

    drawGradient(x, height/4,h);

    drawGradient(x, 3*height/4,h);

  } 

  h++;

  if(h>360)

  h=0;

}

void drawGradient(float x, float y, float h) {

  int radius = dim/2;

  

  for (int r = radius; r > 0; --r) {

    fill(h, 90, 90);

    ellipse(x, y, r, r);

    h = (h + 1) % 360;

  }

}

Cria-se 4 semi-circulos e 6 seis circulos que mudam a cor gradativamente, com todos os circulos possuindo o mesmo gradiente.