17 Inspiring Examples of Parallax Scrolling Sites

By / Oct 7, 2013 / Inspiration
shares

When it comes to parallax scrolling, the line that separates good and bad choices is pretty thin. A while back parallax was being used to deliver an explosion of elements floating around the screen, and a lot of times the websites using the effect were a bit overwhelming. Fast forward a couple years, polish the idea and keep in mind that the “less is more” concept also works for parallax, and you have websites with elegant scrolling effects – like the ones we’ve rounded up for this post.

Baylie WordPress Theme

17 Inspiring Examples of Parallax Scrolling Sites

Broken Twill

17 Inspiring Examples of Parallax Scrolling Sites

theQ camera

17 Inspiring Examples of Parallax Scrolling Sites

Betty and Betty

17 Inspiring Examples of Parallax Scrolling Sites

Scytale

17 Inspiring Examples of Parallax Scrolling Sites

Srgint

17 Inspiring Examples of Parallax Scrolling Sites

Cyclemon

17 Inspiring Examples of Parallax Scrolling Sites

Sojourn Network

17 Inspiring Examples of Parallax Scrolling Sites

This is Now

17 Inspiring Examples of Parallax Scrolling Sites

l’unita

17 Inspiring Examples of Parallax Scrolling Sites

Fall in Tennessee

17 Inspiring Examples of Parallax Scrolling Sites

Made by Block

17 Inspiring Examples of Parallax Scrolling Sites

Kill your Darlings

17 Inspiring Examples of Parallax Scrolling Sites

WAAAC

17 Inspiring Examples of Parallax Scrolling Sites

Spotify

17 Inspiring Examples of Parallax Scrolling Sites

Serve Seattle

17 Inspiring Examples of Parallax Scrolling Sites

Codetex

17 Inspiring Examples of Parallax Scrolling Sites

About the Author

Gisele Muller loves communication, technology, web, design, movies, gastronomy and creativity. Web writer, portuguese/english translator and co founder of @refilmagem & @mentaway Twitter: @gismullr

13 Comments

  1. PJ Brunet
    October 7, 2013

    Whoever explained “parallax scrolling” to you is wrong.

    From Wikipedia: “Parallax scrolling is a special scrolling technique in computer graphics, wherein background images move by the camera slower than foreground images, creating an illusion of depth in a 2D”

    Different layers at different speeds = depth = parallax scrolling.

    Reply
    • Gisele Muller
      October 7, 2013

      Hi PJ,

      Actually I mentioned this in our Parallax list from 2011: http://webdesignledger.com/inspiration/21-examples-of-parallax-scrolling-in-web-design

      This time around I wanted to point that the effect evolved a lot and that now you don’t exactly need as many image movement as before to make a point. It is just a different point of view of the same effect.

      Reply
  2. PJ Brunet
    October 7, 2013

    Now I see srgint.com scrolling at different speeds but most of the links are either not working or just scrolling up and down. Owell.

    Reply
  3. Don Gepulango
    October 7, 2013

    Personally I don’t like parallax scroll websites, it confuses me. Sure it looks great and has some awesome scrolling effects but its a little hard to navigate and loses its legibility.

    Reply
  4. Zac
    October 7, 2013

    They are all parallax, some of them like Scytale and Codetex are just really hard to see.

    Reply
  5. Faraz Ahmad
    October 7, 2013

    They are totally new, unique and adorable :P Parallax is kind of mind diffusion thing, but it’s a new trend, Thank you for your effort, liked it.

    Reply
  6. syed Aly
    October 8, 2013

    Great and different kind of parallax scrolling.Gisele Muller if u ever checked Sweez. I love that site.

    Reply
  7. Dixon
    October 14, 2013

    Wasn’t really aware of the whole parallax scrolling craze and didn’t see it at until I slowed my scroll down then it looked pretty cool. The Sweez site was very cool.

    Reply
  8. Vicky
    October 16, 2013

    Very impressive. I have thought that you should avoid having your users scrolling down long pages. This was amazing and definitely food for thought.

    Reply
  9. Andrzej
    October 16, 2013

    Some of example websites aren’t scrolling smoothly even on my quad-core Mac!
    Oh, poor tablet users :)

    Reply
  10. Robert Ramirez
    October 23, 2013

    I definitely had to see this list since my site is a parallax site. I can agree with some of the comments made. Some sites are difficult to keep up with. Some parallax sites that I have come across have their content come in when you scroll to a certain point. To me that becomes difficult to keep up with. I like the more subtle parallax sites but this is a great list either way. My favorite has to be Baylie and Broken Twill. Awesome.

    Reply
  11. Alex
    January 2, 2014

    Let’s face it when it comes to website design Parallax is in! The Fall in Tennessee website above is a great example. Adding the tiny menu on the far right hand side of the page is smart as some smaller laptops will not show the up and down arrows to scroll through the slides.

    Alex
    Isadora Design – A Professional Web Design Company

    Reply
  12. Akhtar
    April 9, 2014

    Thank you so much! This parallax based hand-picked WP themes would be an useful for your readers too: http://www.webdesignboom.com/2014/parallax-wordpress-themes/

    Reply

Leave a Reply