css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
user profile image

Working CSS3 analog clock, using CSS animations and shapes, without any images or JavaScript.

This is now available on GitHub @ https://github.com/iliadraznin/CSS3clock


  1. This is awesome.

  2. This rocks man! You could have used Sass to simplify all the process :P

  3. So... how do you set it?

  4. Great works, congratz!!

  5. Thanks guys :)

  6. How about using a tiny bit of js to set it?

  7. I might do it as a fork but the whole idea of this particular pen is no js :)

  8. Hi Ilia,

    Great job, you are right no needs at all of Js or other LESS... Just one remark from a stupid guy, how to set the correct time when using from Europe?


  9. Impressive job doing this with CSS only. I wouldn't have thought it possible until I saw this. A bit of javascript may be needed to set the clock. Also the digital display eventually diverges from the analog display.

  10. Very nice. Thanks for sticking it on Github. I'm pouring through it to try and get my head around this. I wanted to have a go at making a simple clock with CSS/JS and this goes way beyond my plans but is an amazing example. You should write something about how you've done it.

  11. Amazing work. Didn't think anyone can make a clock without javascript or programming.

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.