26 October 2012
Isometric Cicada Principle
The cicada principle for web designers is a pretty neato technique for creating seemingly non-repeating backgrounds in HTML & CSS. After being inspired by this process and also drawing pictures on isometric dot paper with my friend, Harold, I decided to make my own. If your browser supports multiple background images on one element and you’re viewing this page directly, then you’re looking at it right now.
The main repeating image is 104 x 180 pixels, and on top of that there is:
So, if we find the LCMs for both the widths and heights, the whole thing doesn’t repeat for 6240 x 2160 pixels! Scroll down the page to view more of the background.
Update: you can now view the design and see the individual images on the design festival site.