Perlin clouds (contours)

const noiseScale = 0.001;

const noiseSpeed = 0.01;

let walker;

​

function setup() {

  createCanvas(500, 500);

  background(100);

  // noLoop()

  noStroke();

  const walker = {

    pos: createVector(random(width), random(height)),

    colour: red

  }

}

​

​

function draw() {

  // const c1 = color('#5C258D')

  // const c2 = color('#4389A2')

  const c1 = color('yellow')

  const c2 = color('magenta')

​

  let time = frameCount / 200

  background(100);

  const cellSize = 5;

  for (let y = 0; y < height; y += cellSize) {

    for (let x = 0; x < width; x += cellSize) {

      const n = noise(x * noiseScale, y * noiseScale, time * 3);

      const frac = map(n, 0.2, 0.8, 0, 1, true);

      // const frac = n;

​

      // fill(lerpColor(c1, c2, frac))

      fill('magenta')

      if(n >= 0.45 && n <= 0.48 ){

          square(x, y, cellSize)

      }

      // fill('black')

      // text(n.toFixed(2), x, y)

      // text(frac.toFixed(2), x, y +6)

      // drawRotatedLineAtXY(x, y, angle);

    }

  }

}

​

// draw line at n is between 0.4 and 0.5