Colour HGB

function setup() {

  createCanvas(windowWidth, windowHeight);

  background(100);

​

}

​

function draw() {

  //background(0)

  // anderer Farbmodus (Hue Kreis 360°, Saturation bis 100%, Brightness bis 100%)

  colorMode(HSB, 360, 100, 100);

  // Linie mit Farbe abhängig der Mausposition

  //stroke(mouseX/3,100,100);

  //Variable für Fabre, map=Dreisatz (Mausposition, fängt bei null and, geht bis Bildschirmende, fängt bei 0 an, nimmt das gesamte Farbspektrum)

  //var col = map(mouseX, 0, width, 0, 360);

  //stroke(col, 100, 100)

  //line(mouseX,0, mouseX, height);

  //fill(col, 100, 100)

  //rect(mouseX,0, mouseX, height);

  /* 

  // gefülltest Quadrat

  fill(0,0,100)

  text(mouseX, 20, 20);

  text(col, 20, 40);

  */

  /*

  // Schnecke im Rechteck, Farbig

  translate(width/2, height/2);

  rotate((radians(col)));

  rectMode(CENTER);

  //fill(col, 100, 100);

  noFill(0);

  // Rechteck wird zur Schnecke, Rechteckgröße & Farbe abhängig von Mausposition

  rect(0,0,col,col);

  */

  /*

  for(i=0; i<width; i++)

  //langsame Generaiton

  //for(i=0; i<millis()/10; i++)

  {

    var col = map(i, 0, width, 0, 360);

    stroke(col, 100, 100)

    line(i, 0, i, height)

    push();

    translate(width/2, height/2);

    rotate((radians(col)));

    rectMode(CENTER);

    noFill(0);

    rect(0,0,col,col);

    pop();

  }

  */

  for(i=0; i<width; i++)

  {

    var col = map(i, 0, width, 0, 360);

    //Saturation durch Mausposition generieren

    var sat = map(mouseX, 0, width, 0, 100); 

    stroke(col, sat, 100)

    line(i, 0, i, height)

    push();

    translate(width/2, height/2);

    rotate((radians(col)));

    rectMode(CENTER);

    noFill(0);

    rect(0,0,col,col);

    pop();

  }

  // im Sketch umschalten des ColorModes möglich ! Ab hier dann wieder RGB

  colorMode(RGB)

}