U1, LA 3.2 Maak je lievelingskleur in de HSB kleurmodus

Hoe werkt de HSB Kleurenmodus?

De volgende pagina’s leggen het uitstekend uit:

Welke website gaat je helpen?

Op Paletton.com kun je een kleurenpalet samenstellen met meerdere kleuren die bij elkaar passen. Om de HSB-waarde aan te passen, moet je bij Paletton op FineTune klikken. Je krijgt niet de hele HSB in beeld, alleen de Hue.

De mogelijke waardes in de HSB (Hue/Saturation/Brightness) kleurmodus zijn: H: [0, 360], S: [0, 100], B: [0, 100].

De Hue (H van HSV) is de hoek in de kleurencirkel: paletton toont die heel duidelijk.
Klik op FIne Tune
Spelen met de HSB waardes

De Opdracht: Je lievelingskleur

Probeer met de tools van Paletton om je lievelingskleur zo ver mogelijk te benaderen. Maak minstens 3 varianten: kleuren die erg op elkaar lijken. Met FineTune regel je dit zo. Zorg wel dat je het verschil tussen de kleuren nog ziet.

Maak nu een P5JS sketch waarin je speelt met de HSB van je lievelingskleur. De Hue is al snel gegeven door Paletton. De S en de V ga jij mee variëren. Probeer S en V elk met 0; 50 en 100. H hou je op je eigen keuze.

Voorbeeld Lievelingskleur

Deze toffe paarse kleur zit op Hue 317. De S en V laten we allebei variëren op 100,60,30 en 0.

function setup() {
  createCanvas(500, 250);
  colorMode(HSB);
}

function draw() {
  background(220);
  // Cirkel 1 bovenste rij: S varieert.
  fill(317, 100, 100)    
  circle(100, 50, 50);
  // Cirkel 2
  fill(317, 60, 100)   
  circle(200, 50, 50);
  // Cirkel 3
  fill(317, 30, 100); 
  circle(300, 50, 50);
  // Cirkel 4
  fill(317, 0, 100); 
  circle(400, 50, 50);

  // Tweede rij: V varieert
  fill(317, 100, 100);
  circle(100, 150, 50);

  fill(317, 100, 60); 
  circle(200, 150, 50);

  fill(317, 100, 30);
  circle(300, 150, 50);

  fill(317, 100, 0);
  circle(400, 150, 50);
}