const startOfHeartX = 0;

const startOfHeartY = 30;

​

//the red dot

//the blue dot is just this but with a negative x value

const ctrlPoint1X = 25;

const ctrlPoint1Y = 0;

​

//the yellow dot

//the green dot is just this but with a negative x value

const ctrlPoint2X = 60;

const ctrlPoint2Y = 45;

​

//the magenta dot

const bottomOfHeartX = 0;

const bottomOfHeartY = 75;

​

let rRed;

let rBlue;

let rGreen;

​

let bgRed;

let bgBlue;

let bgGreen;

​

let spacing = 51;

let scaler;

​

function setup() {

  bgRed = random(210, 255);

  bgBlue = random(210, 255);

  bgGreen = random(210, 255);

  rRed = random(230, 255);

  rBlue = random(120, 255);

  rGreen = random(120, 255);

  spacing = random(30, 65);

  createCanvas(600, 600);  

  background(bgRed, bgGreen, bgBlue);

  pixelDensity(1);

  strokeWeight(random(1, 6));

  scaler = random(1, 1.6)

      createLoop({duration:1.5, gif:true})

​

}

​

function drawSpiral(){

  stroke(rGreen, rRed, rGreen);

  for(var i = 30; i < 1200; i++){

    push();

    rotate(log(i * 50) * 12);

    translate(0, log(i) * spacing);

    scale(scaler/log(i));

    fill(rRed, map(i, 700, 1200, 100, rGreen), map(i, 700, 1200, 100, rBlue));

    drawHeart(0, 0);

    pop();

  }

}

​

function drawHeart(x, y){

  push();

  translate(x, y - 50);

  //now we start drawing the shape

  beginShape();

  //starting point

  vertex(startOfHeartX, startOfHeartY);

  //right half of the heart

  bezierVertex(ctrlPoint1X, ctrlPoint1Y, 

               ctrlPoint2X, ctrlPoint2Y, 

               bottomOfHeartX, bottomOfHeartY);

  //left half of the heart

  bezierVertex(-1 * ctrlPoint2X, ctrlPoint2Y,

               -1 * ctrlPoint1X, ctrlPoint1Y, 

               startOfHeartX, startOfHeartY);

  endShape();

  pop();

}

​

function draw() {

  background(bgRed, bgGreen, bgBlue);

  fill(rGreen, rRed, rBlue, 100);

  noStroke();

  circle(width/2, height/2, 200);

  push();

  translate(width/2, height/2);

  rotate(frameCount/60);

  blendMode(BURN);

  drawSpiral();

  pop();

  textSize(24);

  noStroke();

  fill(255, 10, 10);

  textFont("Parisienne");

  text("Happy", width/2 - 32, height/2 -35);

  text("Valentine's", width/2 - 50, height/2 + 5);

  text("Day", width/2 - 20, height/2 + 38);

}