This is my self portrait
sketch
function setup() {
createCanvas(400, 400);
background(0);
text("p5.js vers 0.9.0 test.", 10, 15);
}
function draw() {
//backgrond
if(mouseX<width/2){
background(186,197,62);
stroke(112,106,41);
fill(112,106,41);
} else{
background(200,170,161);
stroke(167,118,94);
fill(167,118,94);
}
//stars! left side
quad(40,30,30,50,40,70,50,50);
quad(65,55,55,75,65,95,75,75);
quad(40,80,30,100,40,120,50,100);
//stars! right side
quad(350,340,340,360,350,380,360,360);
quad(350,280,340,300,350,320,360,300);
quad(320,305,310,325,320,345,330,325);
//left face area
stroke(158,193,210);
fill(158,193,210);
arc(150,130,150,150,15.3,17.8,HALF_PI); //top left area
fill(158,193,210);
rect(75,130,40,120);//left hair
//right yellow area
stroke(240,216,102);
fill(240,216,102);
arc(220,120,90,90,16.9,13.4,HALF_PI);
fill(240,216,102);
rect(235,120,30,130);//right hair
//right dak blue area
stroke(44,112,171);
fill(44,112,171);
arc(200,120,90,90,16.9,13.4,HALF_PI);
fill(44,112,171);
rect(215,120,30,130);//right hair
//eye and noise
stroke(240,216,102);
fill(240,216,102);
circle(125,140,60);
stroke(240,216,102);
fill(240,216,102);
circle(200,140,60);
stroke(158,193,210);
fill(158,193,210);
circle(200,140,55);
stroke(194,227,245);
fill(194,227,245);
circle(200,140,40);
stroke(0);
fill(0);
rect(163,170,5,15);
rect(158,185,10,3);
//horizontal lines From top to the bottom
stroke(158,193,210);
fill(158,193,210);
rect(235,75,50,15);
stroke(255);
fill(255);
rect(235,95,60,10);
stroke(158,193,210);
fill(158,193,210);
rect(235,110,70,7);
stroke(158,193,210);
fill(158,193,210);
rect(235,120,75,13);
stroke(255);
fill(255);
rect(235,139,75,8);
stroke(158,193,210);
fill(158,193,210);
rect(235,153,75,8);
stroke(255);
fill(255);
rect(235,167,75,8);
stroke(158,193,210);
fill(158,193,210);
rect(235,181,75,8);
stroke(255);
fill(255);
rect(235,195,75,8);
rect(235,209,75,8);
//clothes
stroke(240,216,102);
fill(240,216,102);
rect(140,230,50,20);
stroke(158,193,210);
fill(158,193,210);
triangle(110,270,90,270,60,390);
stroke(240,216,10);
fill(240,216,102);
triangle(150,270,120,270,90,390);
triangle(180,270,210,270,240,390);
stroke(158,193,210);
fill(158,193,210);
triangle(220,270,235,270,270,390);
//button
stroke(44,112,171);
fill(44,112,171);
circle(165,300,20);
circle(165,330,20);
circle(165,360,20);
//jaw
stroke(255);
fill(255);
arc(165,170,130,130,7,2.4,HALF_PI);
}