var canvasWidth = 500; var canvasHeight = canvasWidth; var sideLength = canvasWidth/8 - 10; function setup() { var bg_color = color(17, 22, 158); background(bg_color); createCanvas(canvasWidth,canvasHeight); noStroke(); for (var x = 0; x < 8; x++) { for (var y = 0; y < 8; y++) { fill(random(50,170),random(130,200), random(230,255)); rect(x*canvasWidth/8,y*canvasWidth/8,sideLength,sideLength); } } } function draw() { var bg_color = color(17, 22, 158); rectMode(CORNER); ellipseMode(CORNER); for (var x = 0; x < 8; x++) { for (var y = 0; y < 8; y++) { var chance = random(0,1); if (mouseIsPressed) { if (chance < 0.05 ) { noStroke(); fill(bg_color); rect(x*canvasWidth/8, y*canvasWidth/8, canvasWidth/8, canvasWidth/8); //circles are bright red fill(255, 43, 92); ellipse(x*canvasWidth/8+3,y*canvasWidth/8+3,sideLength-3, sideLength-3); } else { noStroke(); //squares lean blue fill(random(50,170),random(130,200), random(230,255)); rect(x*canvasWidth/8,y*canvasWidth/8,sideLength,sideLength); } } } } }