/Kudeliscope

CSS3 Kaleidoscope Effect

Primary LanguageHTML

Kaleidos: CSS Kaleidoscope Effects

A simple kaleidoscope effect produced with a bunch of SASS-powered CSS rotation and scale transforms on Ged's face.

See it in action here: http://kudeliscope.com

Parameters

You can pass parameters via the query string: e.g. ?n=13&src=http://someurl/someimage.png

  • n is a positive integer representing the number of "segments" to create within the kaleidoscope. The provided CSS enthusiastically supports up to 32 segments but the effect works best with lower values.

  • src is a URL for an alternate image.

  • Assigning a truthy value to clean inhibits the display of the link to Github.

Dedication

Dedicated to @gkudelis, who has the best name ever.

Minutiae

It's funny because Ged's second name is Kudelis, and this is a Kudeliscope... Geddit?

TODO

  • This is complete.

Terms & Conditions

This project is dual licenced under the MIT and GPL licenses because.