L-System Tree

How to use it

Run the real thing here, tune it, then copy the prompt that rebuilds it.

1. 01
   Launch and look

   The preview is the real three.js scene in a sandboxed frame, not a recording. Everything responds to you.

2. 02
   Dial it in

   Swatches recolour, sliders move the parameters that matter, Randomize finds what you would not have typed. Structural changes rebuild the geometry.

3. 03
   Pick your stack

   Single HTML by default, or a Next.js, React, Vue or Astro component that imports three from npm.

4. 04
   Copy the prompt

   It carries geometry, motion, camera and material intent with your values, in build order.

5. 05
   Iterate one element at a time

   Geometry, then motion, then camera, then material. Scroll and hover behaviour usually takes a second pass; that is normal.