CSS3 Link Fade Effect

Published 9th May 2010

If you visit @vpieters awesome new site (or even this site) with the latest Webkit/Opera browsers you might notice the subtle fade effect when you hover over links, instead of the normal instant change. This is done with a nice simple bit of CSS3 transitions.

a { -webkit-transition:all 200ms ease-in; -o-transition:all 200ms ease-in; }

It’s quite a nice effect and something I’m sure we will see more of in the future as CSS animations take off and more browser support it.