Date : 1st July 2005

For all the latest browsers

Updated 10th July 2024

A simple Fibonacci spiral using 12 nested empty divs

Information

1st July 2005

Prompted by a recent comment I give you my CSS version of Fibonacci's spiral (and no, I hadn't heard of it either). But here it is, produced by using just four quadrants of a circle images and sizes in ems so that it will scale up and down with text sizes.

1st July 2005

My pure CSS version using no graphics (but a bit chunky) added. This used em size containers and percentage size 'curves'.

31st August 2009

Moz border radius version updated to add a decreasing border width as suggested by Christopher Robert Jaquez.

10th July 2024

Redesigned to make it responsive and much simpler as all the nested divs have the same styling except for the widths which are calculated using the Fibonacci sequence.

A little unusual in that the smallest Fibonacci curve is generated in the outer div id="fibonacci" and the largest curve is the inner most nested div.

Please consider making a donation, every little helps.