63 lines, 7 of them comments ยท 699 tokens, written in 31 seconds for $0.0003


 1  function setup() {
 2    // Create a canvas that fills the window
 3    createCanvas(windowWidth, windowHeight);
 4    noStroke();
 5    frameRate(60);
 6  }
 7  
 8  function draw() {
 9    // Animated background with smooth color transition
10    let r = 127 + 127 * sin(millis() * 0.001);
11    let g = 127 + 127 * sin(millis() * 0.001 + PI/3);
12    let b = 127 + 127 * sin(millis() * 0.001 + 2*PI/3);
13    
14    // Create gradient effect
15    for(let y = 0; y < height; y++) {
16      let inter = map(y, 0, height, 0, 1);
17      let c = lerpColor(
18        color(r, g, b, 100),
19        color(255 - r, 255 - g, 255 - b, 100),
20        inter
21      );
22      stroke(c);
23      line(0, y, width, y);
24    }
25    
26    // Draw a circle that follows the mouse
27    fill(255, 200, 100, 150);
28    circle(mouseX, mouseY, 50);
29    
30    // Draw a trail of smaller circles
31    for(let i = 0; i < 5; i++) {
32      let offset = i * 10;
33      fill(255, 200, 100, 100 - i*20);
34      circle(mouseX - offset, mouseY - offset, 30 - i*5);
35    }
36    
37    // Draw floating particles
38    for(let i = 0; i < 20; i++) {
39      let x = width/2 + sin(millis() * 0.001 + i) * 200;
40      let y = height/2 + cos(millis() * 0.001 + i) * 150;
41      let size = 10 + 5 * sin(millis() * 0.002 + i);
42      
43      fill(
44        100 + 155 * sin(millis() * 0.001 + i),
45        150 + 105 * cos(millis() * 0.001 + i),
46        200 + 55 * sin(millis() * 0.002 + i),
47        150
48      );
49      
50      circle(x, y, size);
51    }
52    
53    // Text instructions
54    fill(255);
55    textSize(16);
56    textAlign(CENTER);
57    text('Move your mouse to interact', width/2, height - 30);
58    text('p5.js Creative Template', width/2, 30);
59  }
60  
61  function windowResized() {
62    resizeCanvas(windowWidth, windowHeight);
63  }