Click your mouse to reStart / Press "s" to save any frame as a picture
xxxxxxxxxx
let colors = [];
//let angles = [];
function setup() {
pixelDensity(5);
let mySize = min(windowWidth, windowHeight);
createCanvas(mySize, mySize);
colorMode(HSB, 360, 100, 100, 100);
background(0, 0, 95, 100);
}
function draw() {
background(0, 0, 95, 100);
colors[0] = color(0, 0, 95, random(80, 50));
colors[1] = color(30, 70, 95, random(100, 90));
colors[2] = color(60, 60, 95, random(80, 50));
creativeLine();
noLoop();
}
function creativeLine() {
let lineNum = random(height / 10, height / 20);
noFill();
for (let i = 1; i < lineNum / 5; i += random()) {
let offset = random(-2 * width, 2 * width);
strokeCap(SQUARE);
strokeWeight(random(1000));
rotate(PI/3);
gradientLine(
(i / lineNum) * random(width) + offset,
(height / lineNum) * i,
width - (i / lineNum) * random(width) - offset,
(height / lineNum) * i,
random(colors),
random(colors)
);
}
}
function gradientLine(x1, y1, x2, y2, color1, color2) {
// linear gradient from start to end of line
// color from color1 to color2
var grad = this.drawingContext.createLinearGradient(x1, y1, x2, y2);
grad.addColorStop(0, color1);
grad.addColorStop(1, color2);
this.drawingContext.strokeStyle = grad;
drawingContext.setLineDash([
random(random(1) * sin(x1 / x2) + frameCount / random(0.1)),
random(random(100, 200) * cos(y1 / y2) - frameCount / random(125, 75)),
]);
rect(x1, y1, x2, y2);
}
function mouseClicked(){
loop();
}
function keyTyped() {
if (key === "s" || key === "S") {
noLoop();
saveCanvas("DotAndDashLines-003-4-2", "png");
}
}