var x = 0;
var y = 0;

function setup() {
    createCanvas(800,600);

}

function draw() {
    background(mouseX,mouseY,100);
    strokeWeight(mouseX/100);
    // T heng
    x = 20;
    y = 150;
    line(x,y,x+150,y);
    
    x = 20;
    y = y + 6;
    line(x,y,x+150,y);
    
    x = 20;
    y = y + 6;
    line(x,y,x+150,y);
    
    x = 20;
    y = y + 6;
    line(x,y,x+150,y);
    
     x = 20;
    y = y + 6;
    line(x,y,x+150,y);
    
    
    
    //T shu
    x = 83;
    y = 180;
    line(x,y,x,150+180);
    
    x = x + 6;
  
    line(x,y,x,150+180);
    
    x = x + 6;
    
    line(x,y,x,150+180);
    
    x = x + 6;
   
    line(x,y,x,150+180);
    
     x = x + 6;
    
    line(x,y,x,150+180);
    
    fill(mouseY,mouseX,mouseY);
    rect(80,180,26,150);
    
    //Y \
    x = 210
    y = 150
    
    line(x,y,x+75,y+50);
    
    
    y = y + 7
    line(x,y,x+75,y+50);
    
     y = y + 7
    line(x,y,x+75,y+50);
    
      y = y + 7
    line(x,y,x+75,y+50);
    
    y = y + 7
    line(x,y,x+75,y+50);
    fill(mouseX-80,mouseY,mouseX+50);
    quad(x,y-28,x+75,y+22,x+75,y+50,x,y);
    
   
    
    //Y /
    x = 210
    y = 150
    line(x+75,y+50,x+150,y);
    
     y = y + 7
    line(x+75,y+50,x+150,y);
    
    y = y + 7
    line(x+75,y+50,x+150,y);
    
     y = y + 7
    line(x+75,y+50,x+150,y);
    
     y = y + 7
    line(x+75,y+50,x+150,y);
    
     //Y shu
    x = 274;
    y = 228;
    line(x,y,x,150+180);
    
    x = x + 6;
    y = y + 6;
    line(x,y,x,150+180);
    
    x = x + 6;
    y = y + 3;
    line(x,y,x,150+180);
    
    x = x + 6;
     y = y - 3;
    line(x,y,x,150+180);
    
     x = x + 6;
    y = y - 6;
    line(x,y,x,150+180);
    
    //P shu
    x = 420;
    y = 150;
    line(x,y,x,150+180);
    
    x = x + 6;
    line(x,y,x,150+180);
    
    x = x + 6;
    line(x,y,x,150+180);
    
    x = x + 6;
    line(x,y,x,150+180);
    
     x = x + 6;
    line(x,y,x,150+180);
    
    //p )
    x = 160;
    y = 449;
    noFill();
    arc(y,220,x,x-20,radians(270),radians(90));
    
    x = x - 10;
    arc(y,220,x,x-20,radians(270),radians(90));
    
     x = x - 10;
    arc(y,220,x,x-20,radians(270),radians(90));
    
     x = x - 10;
    arc(y,220,x,x-20,radians(270),radians(90));
    
    fill(mouseY,mouseX,mouseY+100);
     x = x - 10;
    arc(y,220,x,x-20,radians(270),radians(90));
    
   // E heng 1
    x = 620;
    y = 150;
     line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    //P shu
    x = 590;
    y = 150;
    line(x,y,x,150+180);
    
    x = x + 6;
    line(x,y,x,150+180);
    
    x = x + 6;
    line(x,y,x,150+180);
    
    x = x + 6;
    line(x,y,x,150+180);
    
     x = x + 6;
    line(x,y,x,150+180);
    
     // E heng 2
    x = 620;
    y = 230;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    // E heng 3
    x = 620;
    y = 305;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    y = y + 6;
    line(x,y,x+80,y);
    
    fill(mouseX-50,mouseY+40,mouseX);
    
    rect(x,y-24,80,24);
    
    
  
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.6/p5.min.js