A rendering of Lumia 800 and its icons made in pure CSS3

A rendering of Lumia 800 and its icons made in pure CSS3(tjrus.com)

10 points by TjRus 12 years ago | 4 comments

Lumia 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.

aroman 12 years ago |

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.

TjRus 12 years ago | |

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.

dylz 12 years ago | | |

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.

forgottenpaswrd 12 years ago |

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.