Branching lightning that grows from a dielectric breakdown model.
Each bolt grows across a grid one step at a time. At every step, the program solves for the electric potential around the growing channel, then adds a new cell with a probability that rises with the local field, which produces the forking, jagged branches of real lightning. When a branch reaches the ground the return stroke flashes, lights up the clouds and the rain-soaked city below.
Try it. Click to strike lightning at that point. Press space for a random strike.
Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.
Build branching lightning with the dielectric breakdown model, using JavaScript and the HTML canvas element. Put everything in a single index.html file with no libraries or build step, so I can open it directly in a browser.
Start simple:
- Make a canvas that fills the window, stays sharp on high-DPI screens (scale by devicePixelRatio), and resizes with the window.
- Cover the sky with a grid of about 120 by 70 cells holding an electric potential: the top row (cloud) is held at 0, the bottom row (ground) at 1, and the bolt, which starts as one cell at the top, also at 0.
- Relax the rest of the grid toward Laplace's equation by repeatedly setting each free cell to the average of its four neighbors.
- Grow the bolt one cell at a time: list the empty cells touching it, pick one with probability proportional to its potential raised to a power (try 0.5 to 3; lower is bushier), add it and remember which bolt cell it grew from. Relax again around the new cell.
- Stop when the bolt touches the ground, and draw it as lines from each cell to its parent.
Once that works, make it beautiful:
- Walk the parents back from the ground to find the main channel; draw it thick and white, with side branches thinning toward their tips.
- Make the strike flash: a return stroke that flickers a few times, glow from drawing the bolt into a small offscreen canvas scaled up additively, and a sky that lights up.
- Add a dark skyline whose buildings count as ground, so bolts seek the tallest ones, plus rain and a thunder shake.
- Strike every few seconds on its own, and strike toward the pointer on click.
Explain the key ideas in short code comments. When you're done, tell me how to open it and suggest three directions I could take it next, such as clouds lit from inside, thunder sound with the Web Audio API, or Lichtenberg figures burned into wood.
