let b = 255;

let g = 255 / 2;

let Grayscale = false;

function setup() {

  createCanvas(windowWidth, windowHeight);

  let button = createButton("click me");

  button.position(0, 0);

​

  button.mousePressed(Grayscale);

}

​

function grayscale() {

  Grayscale = !Grayscale;

}

​

function draw() {

  if (Grayscale == false) {

    r = map(mouseX, 0, 600, 255, 0);

    b = map(mouseX, 0, 600, 0, 255);

    g = map(mouseY, 0, 600, 0, 255);

​

    if ((button = true)) {

      background(r, g, b);

    }

​

    fill(0);

    ellipse(mouseX, mouseY, 64, 64);

​

    fill(255);

    noStroke();

    textSize(16);

  } else {

    let grayscale

​

    if ((button = true)) {

      background(r, g, b);

    }

​

    fill(0);

    ellipse(mouseX, mouseY, 64, 64);

​

    fill(255);

    noStroke();

    textSize(16);

  }

​

  text(

    `RGB: (${nf(r, 0, 0)}, ${nf(g, 0, 0)}, ${nf(b, 0, 0)})`,

    20,

    height - 20

  );

}

​