Where are the trees

This is an experiment trying to create a Tilt-Shift effect on Text using CSS.

See the Pen Tilt-Shift Text by simurai (@simurai) on CodePen.

Once again text-shadow was my best friend. By adding a bigger offset-y and blur-radius to the top and bottom edge, the text appears to have a lens blur that is typical for tilt-shift effects. There is also some rotate, rotateX and skewX to make the text match the perspective of the background image.

Update: Good news for blur fans. CSS filters are coming and you can add blur to any DOM element.