HTC-One-X-CSS3 is my weekend project. I've tried to draw the amazing HTC One X phone purely in CSS3. The only two images are the gif animation as the display and noise image for subtle noise on the device body.
Everything is defined in ems as values. So it is scalable. Also the logo and icons are made as vectors in custom font, so it's clear even on high ppi displays and if scaled up or down.
I only tested this in Firefox 16b and Chrome 23dev. I found that the speaker class is not well rendered in Chrome, so if you find the solution for it, you can commit changes.
If you've found a bug? Please create an issue here on GitHub:
https://github.com/eboye/HTC-OneX-CSS3/issues
Also the demo could be found here: https://eboye.github.io/HTC-OneX-CSS3/
Copyright 2012 SrboDroid.
Licensed under the Creative Commons License, Version 3.0
You must attribute the work in the manner specified by the author or licensor (but not in any way that suggests that they endorse you or your use of the work).
You may not use this work for commercial purposes.
If you alter, transform, or build upon this work, you may distribute the resulting work only under the same or similar license to this one.
More about licence: