21-215a

let pallete = ["#2d3047", "#B1B0B1", "#533747", "#5f506b", "#6a6b83", "#76949f", "#86bbbd"];

​

​

function setup() {

  createCanvas(windowWidth, windowHeight);

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

  background(203, 12, 25);

}

​

function draw() {

  frameRate(10);

   let c1 = color(326, 34, 33); //色A

  let c2 = color(273, 25, 42); //色B

  let c3 = color(238, 19, 51); //色C

​

  //グラデーションを作成点AのXY座標から点BのXY座標までの線形のグラデーション

  let gradient = drawingContext.createLinearGradient(300, 200, 500, 400);

​

  gradient.addColorStop(0.0, c1);

  gradient.addColorStop(0.5, c2);

  gradient.addColorStop(1.0, c3);

​

  //上で指定したグラデーション内容を塗りつぶしスタイルに代入する

  drawingContext.fillStyle = gradient;

  noStroke(); 

​

  circle(random(width), frameCount, random(400), 200);

  stars();

}

​

​

function stars() {

​

  drawingContext.shadowBlur = 1;

  drawingContext.shadowColor = color(65, 5, 97); 

  for (let j = 0; j < 10; j++) {

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

      let x = i * random(width);

      let y = j * random(height);

​

      circle(x, y,2);

      fill(59, 81, 100);

    }

  }

 }