Long shadow generator

A Sass mixin that makes pulling off 'long shadow design' as easy as pie.

For more information about this design trend, head over to http://je.roon.io/long-shadow-design. Just make sure not to look at the compiled CSS :)

Follow me @awesomephant for updates.

Features

• Works with any element, both text-shadow and box-shadow is supported.
• Variable color
• Variable shadow length
• Shadow can either point to the left or to the right
• Define if the shadow is skewed or not
• Choose if the shadow fades out or not (still in beta)

  
.my-thing {
  @include long-shadow($type: text, $color: indigo, $length: 50, $fadeout: false, $skew: true, $direction: right);
}
  //That's it!
  

How does it work?

Basically: It uses a Sass @for loop to create a number of box-shadows, every shadow with a slightly different position. The number of shadows is based on the length that you enter.