createCanvas(500, 500);

  background('white');

  noLoop();

  //remember to do noLoop if you dont want the draw function to repeat

}

​

//----- clover image import

function preload(){

  clover = loadImage("clover.png");

}

​

​

//===============================

​

let space = 20;

let stripeWidth = 20;

//------ here im declaring the colors

let myColors = ["#FF48B1", "#FFEB00", "#BECD08", "#0E94C8"];

​

//------ make empty array for chosen colors

let pickedColors = [];

​

//------ The randomInteger(min, max) function generates a random integer between min (inclusive) and max (exclusive) by scaling and shifting a random floating-point number, then rounding it down to the nearest integer.

function randomInteger(min, max) {

  return Math.floor(min + (max - min) * Math.random());

}

​

//------The pick(inputArray) function selects and returns a random element from the provided array by choosing a random index using the randomInteger function.

function pick(inputArray) {

  return inputArray[randomInteger(0, inputArray.length)];

}

​

//------This code selects a random color from the myColors array four times and stores each selected color in the pickedColors array. After the loop completes, pickedColors will contain four randomly chosen colors from myColors.

for (let i = 0; i < 4; i++) {

  pickedColors.push(pick(myColors));

}

​

//------The someColors() function returns an array containing n randomly selected colors from the possibleColors array. It does this by looping n times, picking a random color each time, and adding it to the pickedColors array, which is then returned.

function someColors(n, possibleColors) {

  let pickedColors = [];

  for (let i = 0; i < n; i++) {

    pickedColors.push(pick(possibleColors));

  }

  return pickedColors;

}

​

//------ this function makes the stripes heading towards the vertical and controls the x value

function stripesVerti(){

  for (let x = 0; x < width; x += stripeWidth + space) {

  noStroke();

  blendMode(MULTIPLY);

  fill(pick(pickedColors));

  rect(x,0,stripeWidth,height);

    //width and height are mapped to the rect to make an endless pattern

  }

}

​

//------ this function makes the stripes heading towards the horizontal and controls the y value

function stripesHori(){

  for (let y = 0; y < width; y += stripeWidth + space) {

  noStroke();

  blendMode(MULTIPLY);

  fill(pick(pickedColors));

  rect(0,y,width,stripeWidth);

//width and height are mapped to the rect to make an endless pattern

  }

}

​

​

​

function draw(){

  stripesHori();

  stripesVerti();

  blendMode(BLEND);

  // let randomX = random(0, width - 50);

  // let randomY = random(0, height - 50);

  // image(clover,randomX,randomY,50,50);

​

}

​

​

​