3D text using just CSS

I have no idea if it’s been done before, but I’ve long wanted to put together a quick little demo showing the power of CSS’s text-shadow property. Turns out the latest versions of Chrome, Safari, Firefox, and Opera all render multiple text-shadows on elements, just like box shadows.

3D text using just CSS

So I threw this together: 3D text using nothing but CSS. No extra markup, no :before or :after mess, and no images. Just progressively enhancing CSS to add some flair to your work.

Check out the demo and let me know what you think!


Have a question about this post, Bootstrap, GitHub, or anything else? Ask away on Twitter or in my AMA repo.