The newest design trend among designers all over the world, flat long shadow, used by web designers on flat designs. The flat style design means designs without textures, shadows and gradient and yet it is very effective and sharp design style.

Create a flat long shadow in Photoshop using this free Action, very easily customizable, you will be able to speed up the process of this trendy technique.



The flat design trend in on the rise, the most interesting thing that stands out is the use of long flat shadows, specifically for icons and small UI elements. This technique isn’t new, it’s been a widely-used resource in photography to emphasize shapes and transmit different emotions to the viewer. This trend has shadows with a characteristic 45º angle below the horizontal axis and a gradient color close to the background shade. You can use this style quite effectively with flat style designs.

Long Shadow Design Examples

Flat long shadow design is popular in mockups right now, here’s a gallery of some great examples of long shadows.





Google Fonts CSS longshade Icon


Long Shadow Generator


Long Shadows Icon and Text Generator



Flat design was created to increase simplicity and reduce file size for the mobile web and it did exactly what design is supposed to do, solve problems. Long Shadow Design is still a newcomer design trend but already a big craze both among designers and users. I hope you found this freebie useful, enjoy!

About the Author: Alex Roman

I'm a 24-year old independent graphic artist and architect based in Bucharest and also the co-owner of iCanBeCREATIVE. I specialize in branding for small businesses and startups: logos, websites, flyers, posters; mostly everything a brand may need to put the word out there in a professional way.

I really love what I do. Want to hire me? Follow me on Facebook or Twitter.

  • Leah:

    I’ve definitely seen a lot of these lately! Personally I like it, but I’m very much on the flat design bandwagon. I’m wondering if it has what it takes to stand the test of time. Flat design seems to have a pretty good hold overall but will it withstand?

  • NGL:

    Thank you, it’s a fantastic action

  • Turanian:

    A very helpful action…Great thanks.

  • Anand RK:

    Awesome, Thanks for shairng

  • Diego:

    Hello, is´t me again. It works! I was running the action over the whole image, but if I run it layer by layer I get this awesome effect!


  • Diego:

    Hello, thanks for the action, but I have a problem. When I use it on a flat design it only duplicates the layer and creates a gradient overlay. But it stops here.

    Is there any need that the image must have (size, etc.)?? Thank You!

  • Michael W.:

    Wow! They just simply amazing! Great job and wonderful action! Thank you so much! :)

  • Ryan Lombardo:

    I bow to your talent! Thanks!

  • Rachael:

    Nice job!! :)

  • Barry Jones:

    This looks like an awesome action… Well done!

  • Martin Chaov:

    awesome, just downloaded it & works great! love it!

  • James Edmonds:

    Thanks! great freebie :D

  • Todd Gilbert:

    Awesome, thanks for this!

  • Evan Jacobs:

    It Worked Awesome. Thanks!