Genuary 15: Rugs - OpenProcessing

mySketch
xxxxxxxxxx
 
p5.disableFriendlyErrors = true
​
function setup() {
  createCanvas(600, 600);
  noLoop()
}
​
function mouseClicked() {
  redraw()
}
​
function draw() {
  colorMode(RGB, 255)
  background('#7D8FA0')
  
  push()
  fill('#556D83')
  drawingContext.filter = `blur(${10*pixelDensity()}px)`
  rectMode(CORNERS)
  translate(0, 10)
  rect(width*0.25, height*0.1, width*0.75, height*0.9)
  pop()
  
  colorMode(HSB, 100)
  const baseHue = random(100)
  const spread = random(1, 25)
  const base = color(baseHue, 20, 100)
  const colors = [base, base, base, base]
  for (let angle = -4; angle <= 4; angle += 2) {
    colors.push(color((baseHue + angle * spread)%100, 30, 80))
  }
  noStroke()
  
  const step = 0.01
  let row = 0
  let col = 0
  
  for (const y of [height*0.1, height*0.9]) {
    const side = Math.sign(y - height*0.5)
    colors.sort(() => random() > 0.5 ? -1 : 1)
    strokeWeight(6)
    col = 0
    for (let x = width*0.25 + (row%2===0 ? width*step/2 : 0); x <= width*0.75; x += width * step * 4) {
      stroke(colors[col%colors.length])
      noFill()
      line(x, y, x+random(-2, 2), y+side*3*step*width)
      col++
    }
  }
  
  row = 0
  col = 0
  noStroke()
  for (let y = height*0.1; y <= height*0.9; y += height * step) {
    colors.sort(() => random() > 0.5 ? -1 : 1)
    col = 0
    for (let x = width*0.25 + (row%2===0 ? width*step/2 : 0); x <= width*0.75; x += width * step) {
      fill(colors[col%colors.length])
      circle(x, y, width*step*1.5)
      col++
    }
    row++
  }
}
​
function keyPressed() {
  save('rug.png')
}