Transparency in Web Design, Inspiration Showcase

As you have probably noticed, transparency is a pretty common trend in web design and I myself think it looks pretty stylish. It adds up character and individuality to a design, even if it adds up in popularity between web designers.

You can play with the opacity on the menu or different other elements from you design and make it as transparent as you think it look best of all. You can play with tones and lighting of the transparent elements in your design and get the wanted effect. It really reminds me of the interface of Windows 7, and I can say that its design is my favorite so far.

There are several methods that you can achieve this effect and it is not complicated at all, you just have to find the perfect combination and a way to integrate it with your design. This post will showcase some pretty cool examples of transparency in web design.

Transparency in Web Design

The Photo Argus

WWF

Nick Hand

Second Story

24 Ways

Gavin Castleton

Oliver Kavanagh

Squarespace

Go Media

World in My Lens

BenSky

Delicious CSS

Mint

Imaginaria Creative

Russ Kirby

Housing Works

Electricurrent

2am

A girl that lives through the lens of her camera - as this is the best way to see things as you want them to see. Born and raised in Moldova, now living in sunny Cyprus.

Newsletter

6 Comments
  1. Danielle Mar 25, 9:44 pm

    We just launched a transparent website for one of our clients, check it out here:

    http://www.sojourntothesource.org

    Enjoy!

    We “heart” transparent websites!

    Reply
    0
  2. Claire Mar 26, 12:28 pm

    Ouch… Just GOT to give you the link to my new (personal) website i launched a couple of hours ago… Lots of transparency!

    http://www.designlabcph.com

    Hope you enjoy it

    Reply
    0
  3. aledesign.it Mar 26, 8:15 pm

    A nice post. Excellent examples..in the last time I prefer use the trasparency…you can create a different works light and particular. A perfect effect for print and web!
    For Claire: GREAT SITE! Add to bookmark! Congratulations!

    Reply
    0
    • Claire Mar 29, 11:48 am

      Thank you!!
      I do like it myself and think it fits me, but very nice to know that I’m not the only one that does :)

      Reply
      0
  4. Hannah Hurst Mar 28, 12:51 pm

    Some really nice examples of transparency in web design here! I think transparency adds real depth to a websites design and can also allow a detailed background to shine through effectively.

    Thanks for sharing.

    Reply
    0
  5. Keith Miller Dec 27, 7:37 pm

    Some nice examples. I like the transparent slide-outs on the WWF site. Fade in/out foreground over a fixed background gives an even better effect. Thanks for sharing.

    Reply
    0

Leave a Reply

*
* Minimum length: 20 characters