220328a

let palette;

​

let gradient_layers = [];

function setup() {

  createCanvas(800, 800);

  colorMode(HSB, 360, 100, 100, 100);

  angleMode(DEGREES);

  noSmooth();

  palette = random(wes_palettes).colors.concat();

  for (let i = 0; i < palette.length; i++) {

    palette[i] = color(palette[i]);

    for (let j = 1; j < palette.length; j++) {

      if (i == j) continue;

      let gradient_layer = createGraphics(random([2,3,4,5,6]), 1);

      gradient_layer.colorMode(HSB, 360, 100, 100, 100);

      let gradient = gradient_layer.drawingContext.createLinearGradient(

        0,

        0,

        gradient_layer.width,

        0

      );

      let c1 = color(palette[i]);

      let c2 = color(palette[j]);

      gradient.addColorStop(0, c1);

      gradient.addColorStop(1, c2);

      gradient_layer.drawingContext.fillStyle = gradient;

      gradient_layer.noStroke();

      gradient_layer.rect(0, 0, gradient_layer.width, gradient_layer.height);

      gradient_layers.push(gradient_layer);

    }

  }

}

​

function draw() {

  clear();

  let offset = width / 15;

  let x = offset;

  let y = offset;

  let d = width - offset * 2;

  let minD = d / 30;

​

  push();

  translate(width / 2, height / 2);

  rotate((int(random(4)) * 360) / 4);

  translate(-d / 2, -d / 2);

  drawSeparateRect(0, 0, d, d, minD);

  pop();

​

  let g = get();

  clear();

  blendMode(BLEND);

  background(random(palette));

  blendMode(MULTIPLY);

  background(0, 0, 0, 30);

  blendMode(BLEND);

  // blendMode(BURN);

  image(g, 0, 0);

​

  noLoop();

}

​

function drawSeparateRect(ox, oy, w, h, minD) {

  push();

  translate(ox, oy);

  let y = 0;

  let xStep, yStep;

  let xMax = w;

  let yMax = h;

  let yArr = [];

  while (y < yMax) {

    let x = 0;

    yStep = random(minD, h);

    if (yStep + y > yMax) yStep = yMax - y;

    let xArr = [];

    let wArr = [];

    while (x < xMax) {

      xStep = random(minD, w);

      if (xStep + x > xMax) xStep = xMax - x;

      wArr.push(xStep);

      x += xStep;

    }

    shuffle(wArr, true);

    x = 0;

    for (let w of wArr) {

      xArr.push([x, y, w, yStep]);

      x += w;

    }

    yArr.push(shuffle(xArr, true));

    y += yStep;

  }

  shuffle(yArr, true);

  let n = 0;

  for (let xArr of yArr) {

    let bool = random() > 0.15;

    for (let arr of xArr) {

      let x = arr[0];

      let y = arr[1];

      let w = arr[2];

      let h = arr[3];

      if (w > 5 && bool) {

        drawSeparateRect(x, y, w, h, minD);

      } else {

        push();

        translate(x + w / 2, y + h / 2);

        let angle = (int(random(4)) * 360) / 4;

        rotate(angle);

        scale(random() > 0.5 ? -1 : 1, random() > 0.5 ? -1 : 1);

        imageMode(CENTER);

        drawingContext.shadowColor = color(0, 0, 0, 33);

        drawingContext.shadowBlur = width / 30;

        noStroke();

        if (angle % 180 == 90) {

          image(random(gradient_layers), 0, 0, h, w);

        } else {

          image(random(gradient_layers), 0, 0, w, h);

        }

        pop();

      }

    }

  }

​

  pop();

}

​

let wes_palettes = [

  {

    name: "BottleRocket1",

    colors: [

      "#A42820",

      "#5F5647",

      "#9B110E",

      "#3F5151",

      "#4E2A1E",

      "#550307",

      "#0C1707",

    ],

  },

  {

    name: "BottleRocket2",

    colors: ["#FAD510", "#CB2314", "#273046", "#354823", "#1E1E1E"],

  },

  {

    name: "Rushmore1",

    colors: ["#E1BD6D", "#EABE94", "#0B775E", "#35274A", "#F2300F"],

  },

  {

    name: "Rushmore",

    colors: ["#E1BD6D", "#EABE94", "#0B775E", "#35274A", "#F2300F"],

  },

  { name: "Royal1", colors: ["#899DA4", "#C93312", "#FAEFD1", "#DC863B"] },

  {

    name: "Royal2",

    colors: ["#9A8822", "#F5CDB4", "#F8AFA8", "#FDDDA0", "#74A089"],

  },

  {

    name: "Zissou1",

    colors: ["#3B9AB2", "#78B7C5", "#EBCC2A", "#E1AF00", "#F21A00"],

  },

  {

    name: "Darjeeling1",

    colors: ["#FF0000", "#00A08A", "#F2AD00", "#F98400", "#5BBCD6"],

  },

  {

    name: "Darjeeling2",

    colors: ["#ECCBAE", "#046C9A", "#D69C4E", "#ABDDDE", "#000000"],

  },

  { name: "Chevalier1", colors: ["#446455", "#FDD262", "#D3DDDC", "#C7B19C"] },

  {

    name: "FantasticFox1",

    colors: ["#DD8D29", "#E2D200", "#46ACC8", "#E58601", "#B40F20"],

  },

  { name: "Moonrise1", colors: ["#F3DF6C", "#CEAB07", "#D5D5D3", "#24281A"] },

  { name: "Moonrise2", colors: ["#798E87", "#C27D38", "#CCC591", "#29211F"] },

  {

    name: "Moonrise3",

    colors: ["#85D4E3", "#F4B5BD", "#9C964A", "#CDC08C", "#FAD77B"],

  },

  {

    name: "Cavalcanti1",

    colors: ["#D8B70A", "#02401B", "#A2A475", "#81A88D", "#972D15"],

  },

  {

    name: "GrandBudapest1",

    colors: ["#F1BB7B", "#FD6467", "#5B1A18", "#D67236"],

  },

  {

    name: "GrandBudapest2",

    colors: ["#E6A0C4", "#C6CDF7", "#D8A499", "#7294D4"],

  },

  {

    name: "IsleofDogs1",

    colors: ["#9986A5", "#79402E", "#CCBA72", "#0F0D0E", "#D9D0D3", "#8D8680"],

  },

  {

    name: "IsleofDogs2",

    colors: ["#EAD3BF", "#AA9486", "#B6854D", "#39312F", "#1C1718"],

  },

  {

    name: "FrenchDispatch",

    colors: ["#90D4CC", "#BD3027", "#B0AFA2", "#7FC0C6", "#9D9C85"],

  },

];

​