L-system tree · grok-4.3

Output generated Cost / run $0.0140 Runtime 23.2s

Prompt for this run

Using the pre-provided p5.min.js (global p5), grow a procedural L-system fractal tree that branches recursively and sways gently in the wind.

⛨ sandboxed Open in new tab ↗

TAKE IT TO CODE

A single self-contained HTML file — copy it and open in any browser, or reuse the prompt with your own pi-agent run.

RUN

modelgrok-4.3

vendorxAI · Grok

harnesspi-agent

generated2026-07-22

METRICS

runtime23.2s

tokens in9.9k

tokens out1.8k

cached2.7k

cost / run$0.0140

Transcript · 8 messages

user

Using the pre-provided p5.min.js (global p5), grow a procedural L-system fractal tree that branches recursively and sways gently in the wind.

assistant

thinking

The task is: "Build a single-page web app and write it ALL into one self-contained file named index.html in the current directory: CSS in a <style> tag, JS in a <script> tag, inline — do not create se...

→ bash {"command":"ls -la"}

toolResult

total 1028 drwxrwxrwx 3 node node 96 Jul 22 17:30 . drwxr-xr-x 1 root root 4096 Jul 22 17:30 .. -rw-r--r-- 1 node node 1034532 Jul 22 17:30 p5.min.js

assistant

thinking

p5.min.js exists. I'll write a self-contained index.html with p5.js inline script for an L-system fractal tree that sways in the wind.

→ write index.html (4999 bytes)

toolResult

Successfully wrote 4999 bytes to index.html

assistant

thinking

The file is created. Let me verify it's correct.

→ bash {"command":"ls -la && head -30 index.html"}

toolResult

total 1036 drwxrwxrwx 4 node node 128 Jul 22 17:30 . drwxr-xr-x 1 root root 4096 Jul 22 17:30 .. -rw-r--r-- 1 node node 4999 Jul 22 17:30 index.html -rw-r--r-- 1 node node 1034532 Jul 22 17:30 p5.min.js <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>L-System Fractal Tree</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; } body { background: #0a0a1a; display: flex; justify-content: center; align-items: center; min-height: 100vh; font-family: Arial, sans-serif; } canvas { display: block; } .controls { position: absolute; top: 20px; left: 50%; transform: translateX(-50%); background: rgba(255,255,255,0.1); padding: 15px 20px; border-radius: 10px; color: white; display: flex; gap: 15px; align-items: center; flex-wrap: wrap;

assistant

thinking

The index.html has been created successfully. It loads p5.min.js correctly with a plain script src, contains all CSS in a style tag, all JS in script tags, is fully self-contained, and draws an L-syst...

`index.html` created and ready.