How to make a slider

Processing Libraries
4

When I first started programming, I made a color creator program with sliders

int w = 600;
int h = 600;

float r = 125;          //red part
float g = 50;          //green part
float b = 5;          //blue part

float range = 500; //size of slider
float yrange = 25;
float min = 0;
float max = 255;

float xR = w / 2;         //where is red slider
float xG = w / 2;         //where is green slider
float xB = w / 2;         //where is blue slider

float yR = w/3 * 2;         //where is red slider 
float yG = w/3 * 2.3;         //where is green slider
float yB = w/3 * 2.6;         //where is blue slider

int kw = 15; //kazauc width
int kh = 45; //kazauc height



void setup() {
  size(600,600);      //width = w, height = h;
  rectMode(CENTER);
  textAlign(CENTER);
}

void draw() {
  if(r < min) { r = min; } else if(r > max) { r = max; }
  if(g < min) { g = min; } else if(g > max) { g = max; }
  if(b < min) { b = min; } else if(b > max) { b = max; }
  
  
  background(r,g,b);
  noStroke();
  fill(100);
  rect(width/2, h/3 * 2.5,width,w/5*2.5);
  strokeWeight(8);
  stroke(50);
  noFill();
  rect(w/2,h/2,w,h,8);
  
  strokeWeight(4);
  stroke(150);
  
  fill(r,0,0);
  rect(xR,yR,range,yrange,8);
  
  
  fill(0,g,0);
  rect(xG,yG,range,yrange,8);
  
  
  fill(0,0,b);
  rect(xB,yB,range,yrange,8);
  
  
  fill(255);
  
  float rX = map(r,min,max,xR - range/2, xR + range/2);
  float gX = map(g,min,max,xG - range/2, xG + range/2);
  float bX = map(b,min,max,xB - range/2, xB + range/2);
  
  rect(rX,yR,kw,kh,6);
  rect(gX,yG,kw,kh,6);
  rect(bX,yB,kw,kh,6);
  
  if(mousePressed) {
    if(mouseX > xR - range/2 && mouseX < xR + range/2) { if(mouseY > yR - yrange/2 && mouseY < yR + yrange/2) { r = map(mouseX,w/2 - range/2,550,min,max); }}
    
    if(mouseX > xG - range/2 && mouseX < xG + range/2) { if(mouseY > yG - yrange/2 && mouseY < yG + yrange/2) { g = map(mouseX,w/2 - range/2,550,min,max); }}
    
    if(mouseX > xB - range/2 && mouseX < xB + range/2) { if(mouseY > yB - yrange/2 && mouseY < yB + yrange/2) { b = map(mouseX,w/2 - range/2,550,min,max); }}
  }
  textSize(30);
  text("R = " + floor(r), 90, height - 25);
  text("G = " + floor(g), w/2, height - 25);
  text("B = " + floor(b), w - 90, height - 25);
  
  println("[mouse X = " + mouseX + "]  [mouse Y = " + mouseY +"]");
}