30+ CSS Text Shadow Effects - Free Code + Demos

Playing around with css text-shadow and the google font 'Luckiest Guy'.

A fun, CSS animation that creates a bounce while mimicking an RGB separation during the process.

Direction-aware text-shadow, use of css variables to create perspective and 3D light effect on text

1960's font effect using CSS text-shadow property along with SASS function and mixins to keep code DRY

Netflix style text animation with CSS and a SCSS function to have the long text shadow

"Your scientists were so preoccupied with whether or not they could, they didn’t stop to think if they should." This doesn't need to exist. But now you can define long shadows with different colors and spreads with one Sass mixin.

A Sass (Scss) Mixin to quickly generate long shadow gradients. Suitable for both 'text-shadow' and 'box-shadow'.

Compilation of some fancy text shadows from around the web: http://blog.typekit.com/2011/07/19/shading-with-css-text-shadows/ http://css-tricks.com/snippets/css/two-color-three-dimensional-blocks-and-text/ http://www.3dcsstext.com/ http://markdotto.com/playground/3d-text/

20-something unique examples of text shadows in CSS, from the beautiful to the bizarre to the "do you still use comic sans, too?" type stuff.

This pen experiments with some simple text effects you can create using text-shadow and hover transitions. I’ve also played around with creating a patterned hover text effect, mixing those effects with a bit of SVG. Created by Ashley Nolan. Twitter: https://twitter.com/AshNolan_ More P...

Read More

text-shadow is a fun little CSS style that can spark up any simple text into a beautiful work of art. yeah! I am exaggerating but text-shadow is really cool.

Exploring overlapping text and box shadow. Using Instagram for design direction: https://www.instagram.com/p/CEEftChAMIG/