Where are the trees is an experiment trying to create a Tilt-Shift effect on Text using CSS3.

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.

See the demo.

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

  1. xiuxing-web reblogged this from simurai
  2. batman70 reblogged this from yurigoytacaz
  3. jeen-hao reblogged this from free-rider and added:
    (via simurai)
  4. idmserial reblogged this from free-rider and added:
    (via simurai)
  5. free-rider reblogged this from simurai and added:
    Drake Zippyshare
  6. yurigoytacaz reblogged this from simurai
  7. outhorand reblogged this from simurai
  8. tl81 reblogged this from simurai and added:
    new Tumblr watchlist...#Filters, which fits in nicely with
  9. themidnightcowboy reblogged this from simurai
  10. submeth reblogged this from olybop
  11. olybop reblogged this from simurai
  12. cybervenom reblogged this from simurai
  13. pixelborne reblogged this from simurai and added:
    pretty cool little project
  14. edcrub reblogged this from simurai
  15. stereojam reblogged this from simurai and added:
    beautiful things. #css3
  16. helloroxy reblogged this from simurai
  17. ceeceecee reblogged this from simurai and added:
    AMAZING! haven’t checked this...other browsers yet teehee! but still…AMAZING! :D
  18. mbaiti reblogged this from simurai
simurai simurai

I’m a UIX Designer and like to experiment with CSS3. This site is my personal playground.

About
Contact