Amazing CSS 3 Recipes

I’ve had two clients ask me for a countdown clock in the past few weeks. Prior to that, I don’t believe I’d ever been asked to create one. The first I created was “ah, ok”, and the client was in a rush so it got the job done. For the second though, I’ve got some time available and wanted to do something truly fabulous. I haven’t created one yet, but I came across some really amazing CSS 3 stuff in the process of my research.

green text showing the time 10:45 similar to an old alarm clock interface
Pure CSS 3 Alarm Clock

First up is this CSS 3 Alarm Clock by Pittsburgh Software & User Experience Consultant, Brian Cavalier. With three flavors, red, green and blue, and using a ton of fancy and somewhat complicated code (let’s just say the markup isn’t particularly valid, but the end result is astonishing), he’s managed to create a gorgeous little piece of computer-generated visual art. I dig it, and if I had an extra web-connected screen laying around, I’d probably leave his site up and running non-stop as my actual clock.

The next discovery on my path to clock countdown-dom is even more amazing. Fire up your Webkit browser (the developer recommends, nay, specifically states, that you should use Chrome), and check out this iPhone made completely of CSS. “Over the top” CSS, to be sure, as creator Jeff Batterton himself states, but no images used at all in the design. How cool.

Up Next: Migrating from BBPress Standalone to BBPress Plugin for WordPress