A rendering of Lumia 800 and its icons made in pure CSS3
tjrus.comLumia 800 and its icons made in pure CSS3. No images, no base64, no SVG, no canvas, just a lot of CSS3 and a little bit of Javascript (with jQuery, of course).
Viewed best with the latest versions of Safari and Chrome in Mac OS X.
This title is extremely misleading. It is absolutely not made in "pure CSS3". It's very much heavily javascript based: https://github.com/TjRus/Lumia.js/tree/master/js
You should really refer to it as you did in your readme as "imageless".
That said, this is really quite cool. Nice job.
I'm not saying that whole Lumia with inretaction done with pure CSS3. Rendering (!) of Lumia and it's icons made in pure CSS (as I write in the title), interactions and few other things - with the help of JS.
It's still somewhat misleading. Like things like css3 transitions and page states maybe using :target or hash to keep state for "is phone on" and stuff, vs just using jQuery.
So what?
There is not secret to rendering Windows 8 icons.
The secret is rendering it on real time, more than 60 times per second, on limited hardware.