Fibonacci is a CSS framework based on the Fibonacci sequence. It does not promise to be useful for web designers, merely a mathematical curiosity. It was created by [Redacted] with support from an unpleasantly cold winter that inspired code writing indoors.
Drop in the fibonacci.css file and get cracking.
Fibonacci operates on a grid system with a few design constraints. The only column widths are 1, 2, 3, 5, and 8, corresponding with the first unique numbers of the Fibonacci sequence. 13 total columns will fit into a row.
A sample Fibonacci-inspired row might look something like this:
<div class="container">
<div class="row">
<div class="col-5">
<p>A sample Fibonacci-inspired row might look something like this.</p>
</div>
<div class="col-8">
<p>Fibonacci operates on a grid system with a few design constraints. The only column widths are 1, 2, 3, 5, and 8, corresponding with the first unique numbers of the Fibonacci sequence. The framework provides a maximum container width of 1300px, with responsive breakpoints included.</p>
</div>
</div>
</div>
Font sizes also follow the Fibonacci trope, with the smallest font weighing in at 13px and the largest clocking in at 55px.