my website contact me
Simple Alert in CSS3iPhone 4 in pure css! Awesome creation! Tweet this?
Cancel
Tweet
tjrus
00:00
0:00
Message
Calendar
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
Clock
Notes
✔
✔
✔
Reminders
Mail
App Store
Videos
YouTube
Calculator
iTunes
Stocks
Voice Memos
23o
Weather
Phone
a
b
c
d
e
f
Contacts
Camera
Music
1
Turn the iPhone on/off
2
Slide the slider to unlock the iPhone (if it's locked)
3
Turn the iPhone on if it's turned off

iPhone 4 in pure CSS3!

Made for Ensoul.me

Buy Ensoul in MacAppStore
Customize the iPhone color:
Or choose the color here -  
. And tweet your version -  
Description:

This rendering of iPhone 4 and its icons were made in pure CSS3.

No images, no base64, no SVG, no canvas, just 4467 lines of CSS code and 533 lines of Javascript code (with jQuery, of course).

Viewed best with the latest versions of Safari and Chrome in Mac OS X.

iPhone features (like in a real iPhone):
  • iPhone states: lock/unlock, on/off;
  • the sound of unlocking and turning off;
  • icon animations;
  • "slide to unlock" letter animation;
  • CSS3 alert demo;
  • ability to customize the color of the iPhone.