Gallery of 3D Elements in Web Design

If you pay attention to web trends you have probably noticed that a growing number of sites are using designs that give the appearance of three dimensions. 3D design elements can help to make the design look more unique, as well as to highlight something in particular by drawing the visitor’s attention. In this post you’ll see 25 websites that use some type of 3D element in the design.

Yoast

Yoast

Sarah Longnecker

Sarah Longnecker

Cognigen

Cognigen

Mystery Tin

Mystery Tin

Woman to Woman

Woman to Woman

SEOmoz

SEOmoz

Zoopa

Zoopa

LogoMoose

LogoMoose

Restroom.nl

Restroom.nl

From the Couch

From the Couch

Snook.ca

Snook.ca

PSD to WP

PSD to WP

Two24 Studios

Two24 Studios

Sam Devos

Sam Devos

Pulse

Pulse

MonAssoc

MonAssoc

Build

Build

Front72 Design

Front72 Design

Addison Kowalski

Addison Kowalski

Jason Reynolds

Jason Reynolds

Carrot Creative

Carrot Creative

The Saturn Project

The Saturn Project

Eurosong

Eurosong

Carl Cartee

Carl Cartee

Canadian Friends of the Israel Museum

Canadian Friends of the Israel Museum

For more design inspiration, please see:

Looking for hosting? WPEngine offers secure managed WordPress hosting. You’ll get expert WordPress support, automatic backups, and caching for fast page loads.

51 Responses

Comments are now closed on this post.

  • Soh Tanaka, June 8, 2009

    Great round up Steven, I’ve noticed this trend has been getting popular in the past few months :-)

  • mamjed, June 9, 2009

    i just finished this site with the same theme.

    lailasstudio.com

  • Sathish, June 9, 2009

    This could be a little better. All I see is foldings, 3D elements can be versatile.

  • Buddy Rigotti, June 9, 2009

    Great list. I also like http://evbc.org

  • Creamy CSS, June 9, 2009

    Nice inspirational list! Thanks for post ;)

  • cosmin, June 9, 2009

    also take a look at icanwatchmovies.com
    In the same style, 3D

  • tenerife holidays, June 9, 2009

    funny how things come in and out of fashion – so 3D’s back again

  • I’ve always been a sucker for good 3D designs. It is needless to say how excited I was to see your list. What I really liked are the ones that use a subtle 3D effect, such as in the examples of Sarah Longnecker, Woman to Woman and a few others. The trick is not to overdo it.

  • Montana, June 9, 2009

    For the most part, the “3d” is limited to a perspective effect on some text support. Nice, but I expect a little more imagination on the designers’ part :)

  • nobody, June 9, 2009

    “3D design elements can help to make the design look more unique”

    doesn’t look too unique to me when everybody does it, as shown in your list here.

  • Web developer, June 9, 2009

    I like these new 3D styles. Some of them are really inspirative.

  • Phil Stricker, June 10, 2009

    Great list. Good ideas too. Some I’ve never come across.

  • Cody, June 10, 2009

    Awesome…there is some great techniques on this list. I do see this becoming more common on some really nice web designs.

  • Web Design Cape Town, June 11, 2009

    Brilliant 3D Elements, now just to apply it….

  • izmir web tasarım, June 11, 2009

    also take a look at icanwatchmovies.com
    In the same style, 3D..

  • dallas rhinoplasty design, June 13, 2009

    so now the question is: how do you do you implement some of these techniques?

  • Basic Computer Skills, June 15, 2009

    Awsome 3d designs

  • Chaitanya VRK, June 15, 2009

    Hey, In all the sites I just see some ribbons… I expected some more 3d elements like 3d icons and more. Do I miss the point in the post or does it miss one!!!

  • kuflu, June 15, 2009

    thanks good designs

  • FlashMoto, June 17, 2009

    So it’s like how they all use 3D stripes. Good post. Thanks

  • Rebecca, June 17, 2009

    they all look the same to me. as mentioned above, all of these examples are using the exact same ribbon effect. I’m not one to bash, but I just don’t see the inspiration here.

  • Vandelay Design, June 18, 2009

    Rebecca,
    You’re right, a lot of them are very similar in approach. That was part of the point, to show the trend. I realize there’s not a ton of diversity.

  • Design were awesome still needs more variety.

    Thanks for sharing with us.

  • Website Design Services, July 7, 2009

    I really like the 3D ribbon effect websites have. I’ve been trying to integrate it into my designs and it usually works out (:

  • Steeee, July 8, 2009

    anyone seen 3d.linnean.org.uk made by lateral visions? dont think you can get more 3D than that! :)

  • 3d design, July 16, 2009

    great collection. i like carl cartee more than other..

  • Kate Clifford, July 24, 2009

    Great collection, if only you could give some implementation hints…

  • andrew, August 14, 2009

    It’s a good thing that I could find some people like you who have so much talent and could share what they know.

  • Free Xbox Live, August 15, 2009

    Very nice 3D elements, especially Snook!

  • Richard Giles, September 28, 2009

    Cool list, but are they any Photoshop tuts that show how to do this?

  • Amir, October 5, 2009

    Good use of 3d effects. Great Collection

  • Nick, October 5, 2009

    nice list. thanks for posting.

  • Microsoft Points Dude, January 1, 2010

    Some of these are very nice, can’t believe some poeple have such talents!

  • mbstuart, March 5, 2010

    I was always impressed with the 3D effects over at http://dragoninteractive.com/
    Anything that makes elements jump off the page can certainly spice up a design.

  • I-5 Design & Manufacture, February 10, 2011

    3D Design is becoming more prominent today, especially in web design. Nice choices, thank you for sharing

  • Joe, March 23, 2011

    Cool 3-D design.

  • Puneet Sharma, November 15, 2012

    Nice collection, but some designs so not match the thumbnail…

    • Steven Snell, November 15, 2012

      Puneet,
      Yes, that is because the post is more than 3 years old and some of the sites have changed their design since that time.