Navigation

Fantastic Content Sliders for your Inspiration

Usability, Web Design | Mar 4, 2010

Content sliders are extremely versatile forms of navigation that can be used to display all sorts of information, such as images, popular posts, social information and product features.

Some have automatic slideshow capabilities or buttons to scroll sideways or up and down, and most of them feature a transition effect, usually a slide motion.

Sliders can be great focal points on websites and blogs as they instantly draw the audience’s attention and provide for an easy and sleek way for visitors to interact with a lot of information that can be sorted through quickly.

In this post, we have compiled a massive amount of content slider examples that you can use for inspiration on your own websites. Enjoy!

 

Violet


Kodu

 

Teoskaffa

 

Tea Round App

 

Dailymile

 

The Great Bearded Reef

 

Templatica

 

Iceberg

 

Daniel Stenberg

 

Flourish Web Design

 

Howarths

 

Andy Shaw

 

Suki

 

The Horizontal Way

 

MetaLab

 

Digital Convulsions

 

SlideDeck

 

Seventy7

 

Richie Qilayout

 

Auxiliary Design Co.

 

Made By Elephant

 

MyGoLocker

 

Icon Designer

 

Food, Inc

 

Sketchen

 

Electronics Arts

 

Eric Johansson

 

Lodjixmedia

 

Holdifre

 

Apple

 

Paramore Redd

 

Pixelounge

 

Benjamin David

 

Lomotek Polymers

 

TweepMe

 

Vegas Uncork’d

 

Nike

 

EnterRodaGata

 

Alienware

 

Also Design

 

Traffik

 

Zendesk

 

Branded07

 

Helldesign

 

Slice Machine

 

JP3 DESIGN

 

FKQ

 

ShoeGuru

 

Go-On-Web

 

Tutorialzine

 

Dreamer Lines

 

Sunny Zheng

 

Visuall

 

Jarnheimer Productions

 

Tracermedia

 

Robert Atlan

 

A Simple Measure

 

Sean Nieuwoudt

 

Front-End Design Conference

 

Coda

 

Suberapps

 

Spundo

 

Hello Themes

 

Eighty8Four

 

Miro

 

Deluge Studios

 

Microsoft

 

Lucas Hirata

 

Threadless

 

Simplicity Law

 

Viewport


 

Sprinkle Penny

 

GoBible

 

Arteria Plastica

 

Wall Swaps

 

Lift

 

8Interactive

 

Rapid Xhtml

 

Find Me By IP

 

Cu3Er

 

Domenico Tedone Design

 

NETWiSE Strategies

 

Redesign Unit

 

Josh Smith Portfolio

 

Mint

 

Department of Infrastructure and Planning

 

Galan

 

Larkef

 

Direct Design

 

Nealite

 

World Wildlife Fund

 

Fat-Man Collective

 

Netdreams

 

Nuemedia


 

Viljami Salminen

 

OSDN

 

Chantyce

 

Giraffe Restaurants

 

Add Noise

 

Nosotros

 

HABITAT 4D

 

Go Site Wave


Do you use content sliders? How do they affect your website usability?



Share this post
Comments (no login required)
  • Luis Craik

    F-i-r-s-t!
    This is awsome!! love some of them. Thanks for sharing this content! I hope to see more in the future!!!

    • Taha

      You need to read the previous post.

      • http://www.creativeindividual.co.uk Laura

        I think he was making a point ABOUT the previous post!

      • http://rebzmedia.com Chris

        That’s probably why he has the hyphens between the letters. xD

  • http://plantiis.com Noe Ruiz

    Great List, love the iPhone slider examples

  • Smasty

    Maybe the f-i-r-s-t-!-!
    And maybe not…

    Really, I hate your article, but…
    … I won’t tell you why!

    • http://www.creativeindividual.co.uk Laura

      Obviously I’m not the only one thinking about the “How to kill the Design Community” article from 2 whole days ago… dangerous move WDD

  • http://www.scmindsolutions.com SCMIND

    Nice selection. I’ve tried the Cu3er its very easy to use. I also like the SlideDeck it looks clean and attractive. Thanks for the post.

  • http://milosmilikic.com Milos Milikic

    Huge list! Lot of inspiration for sure! Thanks!

  • http://www.webke.net/ CyberFox

    Very nice collection! Thanks.

  • http://www.designlovr.com ximi

    Great article with some very inspiring slides, thanks a bunch for sharing!

  • http://lava360.com zohaib

    bundle of really inspiring content sliders. thanks for share guys :)

  • http://www.dennylang.com Denny

    Excellent list. Good job!

  • http://www.smokypixel.eu smokypixel

    Great inspiration. Just what i needed, as I now have to design a website for an interior decorator!

  • http://www.orphicpixel.com Mars

    now that is what we call different arrows

  • http://www.optimum7.com/web-design Anthony Calzadilla

    Awesome roundup – my personal fav is hogwarth’s

  • http://3circlestudio.com/ Justin Carroll

    That was lengthy, thanks for that. I loved the EA and Alienware sliders. I did some interesting slider work on the new Power Rangers site, check it … http://www.bandai.com/powerrangers/mmpr/history

  • Varun

    Great list!! I also like the slider at http://www.lifemojo.com

  • http://mysterye-world.com MysteryE

    Hey!
    Great list!
    Sometimes I need ideas when I build websites that need a slider…

  • http://www.studioweber.com Alex Flueras

    That’s a huge list. Really useful as it covers pretty much everything that has been done so far in terms of content sliders. Thanks for sharing.

  • http://www.techpaf.fr Antoine

    Nice ;)

    Do you know where we can find some good stuff, ready to build, like this ?

    thanks to you

  • http://www.creatusdesign.nl/ Gert van den Brink

    Great list, I loved the Mario site of Teoskaffa, that giant mouse and those ‘big pixels’ gave a nice Nes nostalgia

  • http://www.jlpwebsolutions.com Jye

    Great collection, the macbook slider is an amazing idea.

  • http://www.postmodem.co.uk Daryl SWS

    Nice post! Great collection of sliders and some really innovative uses too.

    *bookmarked*

    Cheers,

    Daryl

  • http://www.lukesbeard.com Lukes Beard

    Wonder where they can go from here with this style of displaying content

  • http://www.webdesignfoc.us Edward Julio B. Tuppil

    Those are Truly Awesome! really inspiring…

  • Nick

    Great list of sliders. Loved some of them.

    I also like the slider of the Brothers in art as the whole website is in general one big slider.

    http://www.brothersinart.com

  • http://www.redesignyourbiz.com/ Maverick

    great examples. they all look cool.

    thanks for the list.

  • http://www.emyjones.com Emy Jones

    Truly inspirational. Just looking at this mega list has filled me with ideas.
    Thanks for taking the time to put this together.

    Emy

  • http://www.blackbookdesign.ca Brian Wilcox

    Great job with the list.
    There’s a lot of new finds that are nice to see.
    Keep it up!

  • http://designerwall.co.za DesignWall

    Awesome Post. Thank you!

  • http://www.netdreams.co.uk Michael

    This is an awesome post, great list… we feel very honoured to be on it! Webdesignerdepot rocks!!! ;-)

  • http://www.jordanwalker.net/index.php Jordan Walker

    Wow, so many to see. I guess that is a standard element now.

  • http://theshapeslab.com lush

    this is a never-ending list, great!

  • Lia Kenig

    Great article… another design that i loved is http://www.bilderish.com
    its in hebrew (i guess) but i loved the flow of the design with the slider.

    ohh, and another site that i loved is: http://www.onepoagelove.com

    • Iggy

      Great sites… TnX

  • http://acquiweb.com/blog Darren Taylor

    Templatica is just a lazy rehash of the styled easyslider demo – hardly inspiring.

  • David

    Awesome collection! A lot of these are very cool.

  • http://ansh.thisisitonline.info/ Amberly | Web Designer

    These were really great examples.
    Good going there..

  • http://danielhellier.com Daniel Hellier

    I really like slidedeck’s. :)

    The mass effect one is good also.

  • http://www.linkedin.com/pub/tom-hendrickson/7/332/68b Tom

    I saw a lovely twist on the average showreel here http://www.clintonbeattie.com

  • http://www.aledesign.it aledesign.it

    Gratful list, more examples so nice..In the last time this is the best way for public their work. Thanks for the sharing!

  • http://www.e11world.com e11world

    This site is pretty sweet http://www.also-online.com/
    I love the animations. WOW and very creative!

    Thanks for this nice long list.

  • atsbil

    Does anyone know of any good slider tutorials?

  • http://voooz.com K

    Super collection

  • shb1023

    super things

  • Stu Green

    http://www.halogy.com has a pretty neat slider on the home page, worth a look.

  • http://isean.co.za Sean Nieuwoudt

    Thanks for the awesome mention guys!

    Much appreciated!

    S

  • http://javatutor.net Java developer

    Nice collection. Big thanks

  • montpiere

    Thanks! I really needed this great list!

  • http://www.websitedesignfranchise.co.uk website design franchise

    Impressive list.I’m getting more inspired to study web design through your creation.It’s a big pleasure to see your artistic designs.

  • http://ericolisboa.com Érico Lisbôa

    thanks mate! very useful!

  • http://alexmansfield.com Alex Mansfield

    Wow! So many great ideas.

  • Sagar Ranpise | Sr. Web/Graphics Designer, Mumbai, India

    Awesome list of sliders!!!

  • http://www.northern-ireland-hotels.com Northern Ireland Hotels

    Superb collection!

    Some really useful sliders that have more than aesthetic qualities.

    Bookmarked and shared,

    Lee.

  • http://www.joeldelane.com Joel Delane

    gutted I wasn’t included in this ! joeldelane.com

    jokes, great post though :)

  • http://espreson.net Espreson Media

    I liked your collection. Experienced new code behind the slider…Thanks a lot…

  • http://www.nathanpurcell.co.uk nathanpurcell.co.uk
  • http://instantblueprint.com Hoxxy

    Holy cow that’s a big list, I’m sure it will come in handy soon, thanks!

  • Esteban Dokavic

    Wow! Great list. Love the Add Noise and Galan sliders!

  • tgmnwdz

    wooow thts great

  • http://www.dharne.com/website_design.php Jane Cooke

    This is a great list to take inspiration from. I liked almost all of them due to the variety of ways they have used sliders.

  • http://www.seqvens.dk/ Nick Bruun

    Great collection of examples. Using all the new features that rich JS libraries give us does sometimes get a bit overwhelming – these examples are a great guideline to how clean you should actually cut it.

  • http://www.ozdtasarim.com Demir

    really nice collection of content sliders.

  • http://www.behindthewebdesign.com Behind The Web Design

    Very nice collection. Thank for sharing.
    Maybe you’d like to check mine (made with jQuery) :
    http://www.behindthewebdesign.com

  • http://www.chotrul.com/ Freelance SEO and Web Design

    Food Inc is absolutely awesome …. I’m a sucker for those big-scale effects.

  • Eduárd

    Great examples! Thx, keep it going!

  • http://www.redesignunit.com Shaishavi Sen

    We are glad that you have posted us in your review and gave us the opportunity to a part among the great list of work done by others. This keeps us challenged and motivate us to do our best

  • http://www.thehorizontalway.com Marco Rosella

    Thanks by The Horizontal Way :-)

  • http://www.g13media.com/ G13 Media

    That’ s a pretty knarly list of really sweet content slider web designs. Thanks

  • http://www.uiredesign.com Web Redesign

    Superb collection. Many thanks for putting them together. I liked Iceberg and
    Howarths very much.

  • http://www.seobounty.com Virginia SEO

    Well I like The Great Bearded Reef the most of the collection. Thank you for sharing it.

  • http://www.tobyjamescreative.com Toby James Creative

    Good list. There’s a particularly nice slider over at http://www.lega-lega.com too…

  • http://javatutor.net Java developer

    Really good stuff! Thnx a lot!

  • http://www.pink-laptop.org.uk Pink Laptop

    Some of these designs are actually really good. Inspiration for sure!

  • Nom Carver

    Nice collection!
    You should add http://www.BlockHeadPix.com

  • http://www.actstudio.ro/ Adrian Iorgu

    Wow. This collection is amazing. Thanks

  • http://infotekmedia.com Fadli Idris

    I like Howarths, it’s cool for me. thanks.

  • http://www.tegingraphics.com TeginGraphics

    Great and Inspiring list but the best design in list “a Auxiliary Design Co.”