Tutorial: Create Retro logo Design With CSS3 Logo

Created purely in CSS scaling up on hover. I used JS for circular placement of elements, then just copied generated CSS to stylesheet. Everything is created using CSS3 shapes. For the outer semi-circles and the dashed border, 36 separate divs are used by both of them which are then placed according to the design.
The animation is done using transitions and scale transforms. These animations are not supported in IE so you won’t see the transition but it’ll jump to the new size on hover. For noise-like background I used two linear gradients.