Texto con efectos con Text-shadow (II)

Text-shadow es una propiedad de CSS3 que te permite realizar muchas cosas curiosas como efectos de fuego o vintage y te da la facilidad también de crear efectos en el texto 3D.
En esta ocasión os mostraré como hacer texto con efecto 3D pero con distintos colores según la cara y otro efecto que simula al "rojo azul" que se puede ver con gafas 3D.

Este efecto es una mejora del clásico 3D, pero en lugar de ser una sucesión de sombras (una detrás de otra que cada vez se aleja más) es una sucesión de una que está desplazada un píxel hacia abajo y otra hacia la derecha, por eso en el lado derecho es más claro y en la parte inferior más oscuro.
Este efecto para hacerlo fácilmente aplicaremos un par de sombras para cada desplazamiento, y en la de color más claro le sumaremos 1px al eje X y a la que tiene el color oscuro 1px en el eje Y (viendo el código se entiende mejor).
Para el ejemplo es mejor usar la notación de color HSL, que nos permite oscurecer el color sin cambiar el tono.

Estereoscópico (rojo-azul)

Este efecto es el típico usado para ver imágenes en 3D, con unas simples gafas (con un cristal rojo y el otro azul) y probablemente si usamos el mismo color que el de una de estas gafas podríamos ver un pequeño efecto tridimensional.
Crearlo es muy sencillo, cogemos un color azul y rojo adecuado y establecemos el color de fuente azul con el 50% de transparencia (con notación RGBA) y la sombra separada unos píxeles con el color rojo e igual semi-transparente.

Resumen

Otra vez más he hecho un par de efectos con text-shadow, volviendo a demostrar su potencial y presentando cosas nuevas, que como siempre podéis probar con el snippet de LESS con el que lo he hecho.