Home▸Drawing with Maths▸Fractal Tree Growth (2D)

🌳 Fractal Tree Growth (2D)

A recursive branch generator drawn straight to canvas: tune max recursion depth, branch spread angle, length falloff per generation and wind strength, then watch every branch and leaf cluster grow in from a smoothstep-eased timeline.

Drawing with Maths2DEasy60 FPS📱 Mobile-adapted⇄ 3D version

This 2D companion draws the same recursive branching idea as the 3D version directly to a flat canvas: a trunk splits into two or three child branches at each generation, each child inheriting a shorter length via the falloff slider and a wider or narrower spread via the angle slider, down to the chosen max depth where leaf clusters appear. Every branch grows in on its own eased timeline rather than popping in at once, and a wind-strength slider adds a sinusoidal sway that increases toward the outer, thinner generations — the same self-similar structure the 3D scene renders in extruded cylinders, here traced as simple 2D strokes so the recursion itself is easy to read.

⚙ Under the hood

Canvas2D recursive branch generator: each node spawns 2–3 children with length scaled by a falloff factor and angle offset by a spread parameter, down to a configurable max depth, with per-branch growth timing and wind sway recomputed every frame.

fractal growthrecursive branchingself-similarityl-systemprocedural generation

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install