p5.js tree
Recreating tree movement wth p5.js
Arboreal Breath
Move the mouse to shape the wind. Each seed grows a unique tree.
Seed
Parameters
9
1.2
How strongly the cursor influences the tree 1.5
3
24
0.45
Colours
#5c3d2e
#4a7c3f
#8fbc5a
Actions
How it works
- Move your mouse across the canvas to direct the wind. The tree’s branches and leaves respond with graduated compliance: the trunk barely moves, while outer branches and leaves flutter dramatically.
- Each seed generates a unique tree with its own personality (branch angles, lengths, leaf placement all seeded via Perlin noise).
- Wave propagation means sway travels outward from trunk to tip with a phase delay, just like a real tree.