Lerp Color 2. Using p5.js library.
function setup() {
createCanvas(720, 400);
background(255);
stroke(255);
strokeWeight(2);
}
function draw() {
background(255);
from = color(255, 255, 0, 0.2 * 255);
to = color(0, 255, 255, 0.2 * 255);
c1 = lerpColor(from, to, 0.20);
c2 = lerpColor(from, to, 0.40);
c3 = lerpColor(from, to, 0.60);
c4 = lerpColor(from, to, 0.80);
for (var i = 0; i < 10; i++) {
fill(from); // 0-120 120-240 240-360 360-480 480-600 600-720
quad(random(-40, 160), random(height), random(-40, 160), random(height),
random(-40, 160), random(height), random(-40, 160), random(height));
fill(c1);
quad(random(80, 280), random(height), random(80, 280), random(height),
random(80, 280), random(height), random(80, 280), random(height));
fill(c2);
quad(random(200, 400), random(height), random(200, 400), random(height),
random(200, 400), random(height), random(200, 400), random(height));
fill(c3);
quad(random(320, 520), random(height), random(320, 520), random(height),
random(320, 520), random(height), random(320, 520), random(height));
fill(c4);
quad(random(440, 640), random(height), random(440, 640), random(height),
random(440, 640), random(height), random(440, 640), random(height));
fill(to);
quad(random(560, 720), random(height), random(560, 720), random(height),
random(560, 720), random(height), random(560, 720), random(height));
}
frameRate(5);
}