CSS3: efecto reflejo

Un bonito efecto de CSS3 que nos ahorrará de utilizar photoshop para realizar un efecto reflejo de un div, texto, imágen…

Utilizamos la propiedad css3 box-reflect que se encarga de realizar este efecto por ahora solo válido en navegadores webkit.

Ejemplo de uso:

.efecto-espejo {
 -webkit-box-reflect: below -25px -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(255, 255, 255, 0.5)));
}

See the Pen CSS3: texto con efecto espejo by Jorge Maiden (@jorgemaiden) on CodePen.

(*) No funciona en Firefox o IE