Nice CSS3 Transition with Google Chrome Logos

LukyVj

• 33567
• 8
• 1

Simple and nice CSS3 Transition between the images of the old Google Chrome Logo and the newer one, on hover. The basic trick here is to hide the top image by turning the opacity down to 0 when the mouse is hovered over it. This reveals the bottom image and since transition property is used in the top image, it renders a fade effect making the whole transition look nice and clean.

Related:

• CSS Only Solar System Model
• Minions in pure CSS
• Multiple Box Shadows
• Clicking Game
• CSS3 Room