CSS3 Digital Clock

You know how the saying goes, something like “when all you have is a hammer, everything looks like a nail”. Lately, as you may have guessed from some recent posts, my favorite hammer has been HTML5 plus CSS3. Recently I’ve been looking for a good alarm clock app for my iPhone, and seeing some of the gorgeous digital clock apps got me wondering if I could create one using CSS3.

After a couple hours hacking last night, I think I ended up with something that looks pretty good. There are generous helpings of CSS3 gradients, rgba, and opacity, a side of CSS transitions, and a sprinkling of skew and scale transforms. There’s a side of dojo to pull it all together.

So, go keep some time, and pick your favorite color. Oh, and let it sit for a bit … you never know what might happen.