A collection of CSS3 awesomeness

Today I tweeted asking my lovely followers to send the best examples they could find of CSS3 effects, and as always they were super helpful. I thought it’d be useful to publish the list I’ve got so far, and ask for comments to help this list grow. If you’re looking for neat examples of CSS3 effects that happen on hover, multiple background images, forms that use CSS3, killer CSS3 buttons, or scale and rotate transforms, then here’s a few sites that may inspire you:

Smashing Magazine has done some great articles about CSS3 effects lately.

• CSS3 visual effects article
  • CSS3 polaroids demo
  • Sliding vinyl records demo
  • Awesome overlays demo
• CSS3 buttons article
  • Google style buttons demo
  • Super awesome buttons demo
  • Radioactive buttons demo
• Various CSS3 effects article
  • Inline form labels demo
  • Modal windows demo
  • Newspaper layout with columns demo

Here’s a collection of other sites that either demonstrate how to use these effects, or are already using them in a beautiful way:

• http://farukat.es/: Faruk’s site does has some awesome CSS3 effects — check out the sidebar where the social networks are. (via @KuraFire)
• http://csswizardry.com/css3/: Demo and tutorial of various CSS3 effects. (via @SeanHood)
• http://demo.marcofolio.net/jquery_dj/: Spinning records with CSS3. (via @sea)
• http://analog.coop/#is: Analog’s “About Us” section has rotate and scale. (via @jakeprzespo, @limedaring, and @CreativityDen)
• http://forabeautifulweb.com/buy/dvds: For a Beautiful Web’s awesome DVD action. (via @visualpro, @SteveKubrick, and @jakeprzespo)
• http://sam.brown.tc/: Button-y links, also animations on the social networking stuff. (via jakeprzespo)
• http://outsideapp.com/: Outside app has all kinds of awesomeness. (via jakeprzespo)
• http://inspectelement.com/: Logo, blog post images. (via visualpro)
• http://chirp.twitter.com/: Polaroids rotate, fun spinning shape here: http://chirp.twitter.com/speakers.html. (via urbenkeach)
• http://archivr.com/: Animation on cards. (via meirish)
• http://www.gesteves.com/experiments/starwars.html/: Star Wars opening crawl. (via brookr)
• http://neutroncreations.com/blog/: Totally sweet rotate / transform. (via mindnumbing)

Okay, that’s what I’ve got for now! Please add a comment if you come accross any more Neat-o CSS3 Things™, you never know when I’ll get more Dribbble invites!