CSS3 Tiler

This experiment will only work properly on Safari 5+ or Chrome/Chromium 11/12.
Other browsers won’t be able to show it properly due to the lack of CSS3 3D transformations and/or CSS3 transitions.

Use cursor keys to zoom/rotate the tiler grid.

Set ‘Second Axis Rotation’ to ‘none’ to make tiler behave exactly as my other experiment CSS3 Mosaic.

Tiler will randomly divide the image into flying tiles. I’ve set the maximum possible values to be 12×12.
Modify the rows and columns value to set up to 32×32 maximum tiles.

CSS3 Tiler live demo:

https://hypertolosana.github.io/css3-tiler/index.html

Video of CSS3 Tiler in action, just In case you were unable to see it:

Images are (c) zimpenfish under license CC BY 2.0

3 thoughts on “CSS3 Tiler”

  1. wow this is awesome, and there I was looking for something like this and decided to create on my own!
    So cool!

    Like

Leave a comment