let numParticles = 300; // Increase to make the spiral larger

let angleIncrement = 137.5; // Golden angle

let baseRadius = 10; // Increased base radius for a larger initial size

let growthSpeed = 0.05;

let zoom = 0.5;

let colorPalette = [

  [139, 69, 19], // Snail shell brown

  [205, 133, 63], // Lighter brown

  [160, 82, 45], // Medium brown

];

let currentPalette = 0;

​

function setup() {

  createCanvas(800, 800);

  angleMode(DEGREES);

  createParticles();

  createControls();

}

​

function draw() {

  background(0);

  translate(width / 2, height / 2);

  scale(zoom);

  beginShape();

  noFill();

  strokeWeight(2);

​

  for (let p of particles) {

    p.update();

    stroke(p.color);

    vertex(p.x, p.y);

  }

  endShape();

​

  // Dynamically add particles for continuous outward growth

  if (particles.length < numParticles) {

    particles.push(new Particle(particles.length));

  }

}

​

class Particle {

  constructor(index) {

    this.index = index;

    this.angle = this.index * angleIncrement;

    this.radius = baseRadius + sqrt(this.index) * 8; // Adjusted to make the spiral larger

    this.color = color(...colorPalette[currentPalette]);

​

    this.x = this.radius * cos(this.angle);

    this.y = this.radius * sin(this.angle);

  }

​

  update() {

    // Increase radius to create spiral motion

    this.radius += growthSpeed;

    this.x = this.radius * cos(this.angle);

    this.y = this.radius * sin(this.angle);

​

    // Update color with gradient effect

    this.color = color(...colorPalette[currentPalette].map((c) => map(this.radius, 0, width / 2, c, 255)), 200);

  }

}

​

function createParticles() {

  particles = [];

  for (let i = 0; i < numParticles; i++) {

    particles.push(new Particle(i));

  }

}

​

function createControls() {

  // Growth Speed Slider

  let speedSlider = createSlider(0.01, 0.2, growthSpeed, 0.01);

  speedSlider.position(10, height + 20);

  speedSlider.style("width", "150px");

  speedSlider.input(() => {

    growthSpeed = speedSlider.value();

  });

​

  // Zoom Control Slider

  let zoomSlider = createSlider(0.2, 1.5, zoom, 0.1);

  zoomSlider.position(180, height + 20);

  zoomSlider.style("width", "150px");

  zoomSlider.input(() => {

    zoom = zoomSlider.value();

  });

​

  // Color Palette Button

  let colorButton = createButton("Switch Color Palette");

  colorButton.position(350, height + 20);

  colorButton.mousePressed(() => {

    currentPalette = (currentPalette + 1) % colorPalette.length;

    createParticles(); // Refresh particles with new color

  });

}

​