Christmas just keeps coming in the web typography world. If @font-face wasn’t enough to get your geeky heart a-pounding, then maybe CSS3 will. Web typography has made another substantial step forward thanks to a few CSS3 techniques which allow us to incorporate some pretty impressive features including drop shadows, rotations and multiple columns.

A few examples were presented at SXSWi this year and frankly they’re pretty cool. It’s an odd thing to be able to select and highlight text that sits at an angle with a drop shadow. See for yourself. Below are a few examples of sites using these new techniques.

Created by Alex Girón

Not actually sure who created the Beercamp site. Holler if you know.

Created by Trent Walton

Created by Andy Clarke and Brian Suda for tweetCC

Code examples:

Text Shadow
text shadow: 1px 1px 1px #000; (h-offset y-offset blur #shadow color)
Multiple Columns
column-width: 300px
column-gap: 20px
Rotate
transform: rotate (10deg);