createCanvas(620, 620);

  pixelDensity(1);

  background(220);

  // bg pattern

  // noise

  colorMode(HSB,256);

  loadPixels();

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

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

      let idx = (x + y * width) + 4;

      let n = noise(x*0.001, y*0.001);

      set(x, y, color(int(map(n, 0.0, 1.0, 0, 255)), 255, 255));

    }

  }

  updatePixels();

  colorMode(RGB,256);

  // checkerboard

//   strokeWeight(1);

//   stroke(40);

//   let yctr = 0;

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

//     let xctr = 0;

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

//       if (xctr % 2 == 0 && yctr % 2 == 0) fill(color(255,0,255));

//       else if (xctr % 2 == 0) fill(color(80,200,0));

//       else fill(color(220));

//       rect(x,y,20,20);

//       xctr++;

//     }

//     yctr++;

//   }

  translate(width/2,height/2);

  drawingContext.shadowOffsetX = -2;

  drawingContext.shadowOffsetY = -2;

  drawingContext.shadowBlur = 10;

  drawingContext.shadowColor = 'black';

  stroke(5);

  fill(220);

  strokeWeight(5);

  // hat

  fill(color(255,0,255))

  triangle(-99,0,0,-200,99,0)

  // fa$e

  fill(220)

  circle(0,0,200);

  // eyes

  fill(color(255,0,255));

  circle(-50,-10,20);

  fill(color(80,200,0));

  circle(50,-10,20);

  // glasses

  noFill();

  line(-25,-10,25,-10);

  line(-75,-10,-95,-35);

  line(75,-10,95,-35);

  rect(-75,-30,50,40);

  rect(25,-30,50,40);

  // fill(color(255,0,255));

  //nose

  rectMode(CENTER);

  beginShape();

  vertex(-10,20);

  vertex(0,20);

  vertex(0,0);

  endShape();

  //mouth

  beginShape();

  vertex(-50,50);

  vertex(-25,70);

  vertex(25,70);

  vertex(50,50);

  endShape(CLOSE);

  // rect(0,50,100,20);

}

​

function draw() {

  ;

  // background(220);

}