let k1, k2, tk;

function setup() {
  /**
    stel hier je kleuren in als variabelen
    een variabele is een soort digitaal doosje waar je iets instopt
    en het er dan oneindig keer uitkan halen
  **/
  k1 = color(255, 255, 255);
  k2 = color(255, 0, 0);
  // toverkleur is iedere keer een andere kleur
  tk = color(random(255), random(255), random(255));
 

  createCanvas(200, 200);
}

function draw() {
  background(220);
 
  var pixels = [
    [k1, k1, k1, k1, k1, k1, k1, k1, k1, k1],
    [k1, k1, k1, k1, k1, k1, k1, k1, k1, k1],
    [k1, k1, k1, k1, k1, k1, k1, k1, k1, k1],
    [k1, k1, k1, tk, tk, tk, tk, k1, k1, k1],
    [k1, k1, k1, tk, k2, k2, tk, k1, k1, k1],
    [k1, k1, k1, tk, k2, k2, tk, k1, k1, k1],
    [k1, k1, k1, tk, tk, tk, tk, k1, k1, k1],
    [k1, k1, k1, k1, k1, k1, k1, k1, k1, k1],
    [k1, k1, k1, k1, k1, k1, k1, k1, k1, k1],
    [k1, k1, k1, k1, k1, k1, k1, k1, k1, k1]
  ];
 
  tekenPixels(pixels);
}

function tekenPixels(pixels) {
  for(var i = 0; i < pixels.length; i++) {
    for(var j = 0; j < 10; j++) {
      fill(pixels[i][j]);
      strokeWeight(0);
      rect(j*20, i*20, 20, 20);
    }
  }
}