block by aaizemberg dae118c7b3875c31246d017ab1d9a2a7

rainbow palette using p5js

Full Screen

index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>rainbow palette using p5js</title>  
</head>
<body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.1/p5.min.js"></script>
  <input type="range" id="slider1" name="slider1" min="0" max="900" value="900">saturation<br>
  <input type="range" id="slider2" name="slider2" min="0" max="900" value="900">brightness/lighntess<br><br>

<script>
   var w = 900, h = 100;
   function setup() {
      createCanvas(w, h);
      slider1 = document.getElementById("slider1");
      slider2 = document.getElementById("slider2");
   }

   function draw() {
      colorMode(HSB, w);
      for(var i=0; i < w; i++) {
         stroke(i,slider1.value,slider2.value);
         line(i,0,i,h);
      }
   }
</script>

</body>
</html>