Perlin noise and accumulation in Processing

accumulation.pde

//
// Perlin noise and accumulation.
// Created using Processing 4.0a3.
//
// Code by @marcedwards from @bjango.
//
// A GIF of this code can be seen here:
// https://twitter.com/marcedwards/status/1370206924591960065
//

void setup() {
  size(800, 800, P2D);
  smooth(8);
  colorMode(HSB, 1);
  noFill();
  stroke(0.05);
  strokeWeight(1);
  frameRate(30);
  //noLoop();

  // This is the important bit. With this blend mode, drawing is accumulated.
  blendMode(ADD);
}

void draw() {
  background(#191030);

  // Change this to make it look different. This is also how it is animated.
  float seed = 1 - frameCount * 0.05;

  float anim = sin(seed) * 0.05 + sin(seed * 0.3) * 0.02;
  float anglestep = TAU / 72;
  float radiusmax = width * 0.25;
  float radiusstep = width * 0.0002;

  for (float radius = -radiusmax * 0.3; radius < radiusmax; radius += radiusstep) {
    float hue = 0.8 + -0.2 * (abs(radius / radiusmax) % 1);
    stroke(hue, 0.5, 0.025);
    beginShape();
    for (float a = 0; a <= TAU + anglestep * 2; a += anglestep) {
      float offset = radius + loopNoise(a, 0.8 + anim, radius * 0.04 + seed) * 300;
      float x = width / 2 + cos(a) * offset;
      float y = height / 2 + sin(a) * offset;
      curveVertex(x, y);
    }
    endShape();
  }
}

float loopNoise(float angle, float diameter, float z) {
  return noise(cos(angle) * diameter + diameter, sin(angle) * diameter + diameter, z);
}