【 p5.js 】Whimsical Gradations.
code( p5.js )
let num = 15; let angle = 1.0; function setup() { createCanvas(500, 500, P2D); colorMode(HSB, 360, 100, 100, 100); drawingContext.shadowBlur = windowWidth*0.08; //0.08-1.2 noLoop(); } function draw() { background(255); marble(); } function marble() { angle += 0.1; for (let i = 1; i <= num; i++) { let x = sin(angle * i) * (min(width, height)); let y = cos(angle * i) * (min(width, height) / 2.5); let size = sin(angle) * i * random(90,10); let h = map(i, random(num), num, 1, 10); fill(120, 10, 0); push(); // shape Color let col1 =["#79CBCE", "#D1ECEC"]; let gd1 = random(col1); drawingContext.shadowColor = gd1; // shape Position blendMode(DIFFERENCE); translate(sin(angle * 2) * x + width / 2, tan(angle) * y + height / 2); rotate(angle * num); // shape Draw strokeWeight(10000); stroke(h, 10, 100); ellipse(0, 0, random(20), 2000); bezier(30, size + sin(y), 0,0, size * sin(140 * angle), size * sin(angle), cos(120 * angle), size * cos(100 * angle), size, sin(220 * angle), 80, sin(130 * angle)) pop(); } blendMode(BLEND); }
openProcessing
License
memo / comment
なぜこうなるのかわからない。だがそれがいい。 let num と drawingContext.shadowBlur の値を触ると、いろんな見え方をして面白いです。 shape Colorは適当に入れてます。 印刷すると綺麗かもしれないです。