P5jsでは簡単にカラーピッカーを使うことができます。

let inp1,inp2;
let slider;
let str=0;
let strw=1;
let button;
let button2;
function setup() {
  createCanvas(400, 400);
  background("white");
  inp1=createColorPicker('#000000');
  slider=createSlider(1,100,1);
  button=createButton('save');
  button.mousePressed(saveImg);
  button2=createButton('x');
  button2.mousePressed(deleteImg);
}

function draw() {
  //background(220);
  str=inp1.value();
  strw=slider.value();
  stroke(str);
  strokeWeight(strw);
  if(mouseIsPressed){
  line(mouseX,mouseY,pmouseX,pmouseY);
  }
}

function saveImg(){
 save(year()+"_"+month()+"_"+day()+"_"+hour()+"_"+minute()+"_"+second()+".png"); 
  
}
function deleteImg(){
 background('white'); 
}