Pure CSS3 Bouncing Dribbble Ball
Dribbble logo in pure CSS3. I created this logo using some basic and advanced CSS3 properties like transforms. The main trick here is that all the elements have borders and they are rotated and scaled in X-direction to give an oval shape.
The highlight and the shadow are created using span elements. Highlight is just a simple oval shape with z-index lower than those borders so that it goes beneath them. Shadow has the same width as the main logo and has box-shadow to create the blur effect.
I would love to have some suggestions / improvements / comments :)