CSS Rotate

Rotate any element with pure CSS using the CSS3 transform modifier. Even apply easing to smoothly transition between your starting, and finishing rotation!

CSS Rotation is currently supported in the following browsers:

If you want to see the effect in action hover over the CSS Rotate splat!

Usage Scenarios

Want to show a clients photo gallery, event or gathering off in polaroid style. You could overlay a variety of photos, and rotate each in a slightly different way to get a really great effect. I've also seen this used to animate appliances, e.g. weighing scales where the dial spins, a wheel of fortune, the list goes on.

Maybe some day we will see a high tech or gadget store weighing up the price of your order on a scale. A quirky mix of old and new. I happen to think that would look pretty cool!

Other Information

Please note, this website is built using a variety of CSS3/CSS2 properties and as such might not display correctly in older web browsers (although it should degrade nicely).

We would always suggest keeping your web browser up to date where possible.

A mini site by Huddersfield Marketing and Design Agency