50 Beautiful CSS-Based Web-Designs in 2006

Advertisement

2006 was rich on creative, beautiful and unusual design concepts. We’ve seen a lot of whitespace, many examples of readable and usable text-design, badges, stars, rounded corners, shapes, gradients, mirror and 3D-effects – just name it. Let’s take a close look at some of the most beautiful designs we’ve seen in 2006. Links checked: May/29 2008 – 5 outdated designs deleted.

Vibrant Designs

Screenshot

SteveLeggat.com

Screenshot

Emotionslive.co.uk

Screenshot

Dinis91.com

Screenshot

Joyent.com

Screenshot

Haveamint.com

Screenshot

Vivabit.com

Screenshot

olivier.danchin.neuf.fr

Screenshot

Foxie.ru

Screenshot

Cameronmoll.com/portfolio

Screenshot

Tonyyoo.com/v2

Screenshot

Komodomedia.com

Screenshot

Bartelme.at

Screenshot

Quatuour.be

Screenshot

Onlinecenter.nu

Screenshot

Fall.tnvacation.com

Screenshot

Zero.ru

Screenshot

Methodarts.com

Screenshot

Summer.tnvacation.com

Screenshot

Icebrrg.com

Dark Designs

Screenshot

Kineda.com

Screenshot

Colourmod.com

Screenshot

Rikcat.com

Screenshot

BeSuperCharged.com

Screenshot

Veerle.duoh.com

Screenshot

Obuweb.com

Screenshot

Slideshowpro.net

Screenshot

Whitwa.net

Light Designs

Screenshot

Mstefan.com

Screenshot

Subdued.net

Screenshot

Devlounge.net

Screenshot

Theologisches-seminar-elstal.de

Screenshot

Nice-Design.co.uk

Screenshot

Media2006

Screenshot

ElectricPulp.com

Screenshot

SusannePaschke.de

Screenshot

PixelEden.net

Screenshot

Jek2k.com

Screenshot

Morellc.com

Screenshot

Attitudedesign.co.uk

Screenshot

CSS Vault

Screenshot

Evaneckard.com

Screenshot

WallopCreative.com

Screenshot

Jeffcroft.com

Vitaly Friedman loves beautiful content and doesn’t like to give in easily. Vitaly is writer, speaker, author and editor-in-chief of Smashing Magazine, an online magazine dedicated to designers and developers.

  1. 101

    gilles

    April 1st, 2007 11:47 pm

    It’s very great!

    +1
  2. 102

    Jamessy

    April 4th, 2007 12:53 am

    First class designs and sites – there really is no excuse for using tables these days!

    0
  3. 103

    bedava

    April 13th, 2007 3:36 pm

    They are really nice, photoshop and css they both perfect.

    +1
  4. 104

    Mikl

    April 15th, 2007 8:15 am

    Une grande partie de ces design sont magnifique, mais il y en a qui n’y ont pas vraiment leurs places… Il existe sur le web vraiment plus beau que cela en design XHTML/CSS.
    En tout cas, merci pour la liste, qui peut etre une excellente source d’inspiration…

    0
  5. 105

    jim

    April 16th, 2007 10:46 pm

    The sites shown here are visually appealing. The use of css to handle the layout, graphics, backgrounds, links is very well handled. The only issue is the css over takes the message and clouds the content. Sometimes simplicity can speak volumes. Our initial designs for our firms site looked very similar to all the ones shown here. Is that a coincidence. I don’t think so. The web-designer was referencing these sites for layout ideas. I think that is common amongst many designers these days. There is so much out there that looks fantastic, that one feels the urge to do it themself. Most web 2.0 sites look the same. I think we can all agree on that.

    0
  6. 106

    Rahim

    April 17th, 2007 6:12 pm

    Great list, all very Sexy and informative!

    0
  7. 107

    pete86

    April 21st, 2007 10:31 pm

    Nice list! Similar gallery is also here.

    0
  8. 108

    Sachin

    April 25th, 2007 2:05 pm

    Great , i shocked by desinging list. Very informative

    0
  9. 109

    jon

    April 26th, 2007 3:29 am

    It only took me 4 months to find this. Very nice work, thank you.
    all the best, jon

    0
  10. 110

    The Pageman

    April 28th, 2007 5:16 am

    mind-boggling list! truly an inspiration! thanks for putting this up!

    0
  11. 111

    erika Rodriguez

    April 29th, 2007 1:23 am

    hi! can you say me, where i can buy your magazine.
    I live in Puebla, mexico.

    i dont’ know if you sell your magazine in my country.
    it’s very interesting.

    thank you

    0
  12. 112

    cocoliso

    May 2nd, 2007 10:36 am

    This is going to give me some great ideas. Thanks for your work.
    How’d you come across these sites anyways?

    0
  13. 113

    John

    May 2nd, 2007 10:49 pm

    simply great stuff yar……………

    0
  14. 114

    johnthomasedison

    May 2nd, 2007 10:51 pm

    tnx for givng this fantastic listing. its really a great effort to pick the pearls from the sea……

    0
  15. 115

    Adam Alyan

    May 3rd, 2007 6:14 am

    Really great collection, keep it up

    0
  16. 116

    ali kaplan

    May 8th, 2007 1:26 am

    definetly wonderfull designs,
    i guess that “who are the designers of this websites ?”

    0
  17. 117

    Bielizna

    May 10th, 2007 1:46 am

    Very impressive list, especially I like “haveamint.com” you can almost feel the freshness.

    0
  18. 118

    Luciano Vento

    May 12th, 2007 8:20 am

    Gracias por la expocisión..muy inspiradora.

    0
  19. 119

    Meble biurowe

    May 12th, 2007 10:35 pm

    Nice Page with interesting comments. useful to build a new site

    0
  20. 120

    Steve

    May 18th, 2007 11:07 pm

    Great resource- however -

    where are e-commerce designs?? Sure these are all amazing but why hasn’t e-commerce embraced CSS based designs?

    Corporate are finally getting there (ESPN, Sprint etc) but still not so many big online retailers are using this.

    Someone please post links to these – as getting clients to invest in CSS based designs for e-commerce is still near impossible.

    0
  21. 121

    Calif

    May 19th, 2007 11:26 am

    best site of its kind :-)

    0
  22. 122

    Youzer

    May 22nd, 2007 11:12 pm

    this video and movie site has a good css and ajax combination
    I hope you like it…
    link

    0
  23. 123

    David Behan

    May 23rd, 2007 5:46 pm

    That’s a really great list. Thanks for sharing. Really like the vibrant designs collection. Rgds, Dave

    0
  24. 124

    ahmanz

    May 25th, 2007 10:29 am

    so well-cssed sites!:)

    0
  25. 125

    valerie

    May 30th, 2007 1:18 pm

    Hi,wow thats a lot of links,it must took you forever!This is very interesting,i love your topics.you sound very educated when it comes to these kinds of things.Me,im just learning css and html,it can be very confusing!Keep at it.Feel free to leave me an e mail sometime:)

    0
  26. 126

    Tim

    June 11th, 2007 11:33 pm

    Awesome work and very inspirational (“,)

    0
  27. 127

    duluoz

    June 22nd, 2007 4:57 pm

    Amazing stuff here!

    0
  28. 128

    Ron Wolpa

    June 24th, 2007 3:39 am

    That´s right , this site is 100% flash (http://olivier.danchin.neuf.fr/pages/home.htm)
    there is nothing to do with CSS ;
    by the looks of it the list needs revamping.;

    0
  29. 129

    Crsistina Mailat

    June 29th, 2007 5:53 pm

    Indeed a great list, a 2007 update will be great. I wish some of my websites to be in this list :D.

    0
  30. 130

    Peter

    July 1st, 2007 6:08 am

    Beautiful sites and compiling them like this makes for a useful inspirational reference, looking forward to 2007′s collection.

    Maybe a separate Web 2.0 collection of sites might also be on the cards??

    0
  31. 131

    buzovski

    July 1st, 2007 5:05 pm

    Great list ! Amazing. Komodio media is really cool :)

    0
  32. 132

    Jennifer Lee

    July 6th, 2007 12:23 pm

    Awesome list! My understanding of css is still in the baby stage, but hopefully I will gain enough experience to make websites as great as these!

    0
  33. 133

    Pierre

    July 7th, 2007 11:41 am

    Thank you very much for this great list.
    I hope to get one day one of my websites in such a listing :P

    Pierre – From France

    0
  34. 134

    DeadLy

    July 8th, 2007 7:46 am

    very nice collection.. Thanks smashingmagazine :)

    0
  35. 135

    Roman

    July 8th, 2007 7:43 pm

    Inspiring! A good material to learn from.

    0
  36. 136

    raj

    July 9th, 2007 9:49 pm

    wow!!! nice collection of CSS based websites. the best thing is that you will find this website on top position (keyword: css based websites)

    thanx great links

    +1
  37. 137

    Robert

    July 11th, 2007 2:11 pm

    I will go home crying, these designs make my dreams worth nothing. Would you make a list for year 2007?
    Good post.

    -1
  38. 138

    Buzz

    July 14th, 2007 7:43 am

    Yeah, I feel like Robert, a new list (or an update of this one) would be really great ;)

    0
  39. 139

    Fabio

    July 19th, 2007 5:30 pm

    I like most of the designs, but there are no big commercial sites here. You should focus more on designs that have advertising on their sites so that we could get inspiration on how to set up a site with advertising too, it’s not easy.

    -1
  40. 140

    Lanad

    July 21st, 2007 6:13 pm

    hi,

    It’s nice to see what we can do with CSS + XHTML but, surely, we need to have in mind that a semantic markup is VERY important to a successful site.

    0
  41. 141

    Kim Harris

    July 26th, 2007 9:30 pm

    Ok i like the designs, any chance of a real elegant one that i could use for free.

    Web design is not my thing but was asked to set up a website to help people who have been abused.

    I would love to know how you guys create such beautiful images, i know what i want but cant design it figred i am alcking the brains so i am going the cheeky route.

    Best wishes

    Kim

    0
  42. 142

    adhi

    August 6th, 2007 6:24 pm

    amaizing css, great..
    thanks for share

    0
  43. 143

    sebo

    August 9th, 2007 7:59 pm

    Great list, some i never saw before!

    check out a new css gallery with very high selection standards

    0
  44. 144

    Emre

    August 17th, 2007 5:05 pm

    Great web sites..

    0
  45. 145

    im suden

    August 21st, 2007 5:55 am

    Of course, I’m jealous that my visual and CSS skills are just not up to the job, but I find a lot of these sites visually confusing, samey and downright difficult to use. They look pretty, but I wouldn’t want to navigate them for any length of time.

    A lot of them don’t strike me as particularly accessible; lots of text rendered as images, for example.

    I guess it depends on how you define beauty – but I’d like to see a top 10 of accessible, usable sites.

    0
  46. 146

    Christoph

    August 22nd, 2007 8:00 pm

    Nice collection, but I am not listed. ;)

    0
  47. 147

    Dainsiderz

    August 30th, 2007 11:10 pm

    Great concept…

    An Artistic way of approach for a business promotion.
    No craps, An eyes to relax while surfing.
    Keep up the good work…

    Bee Dainsiderz
    DXB

    0
  48. 148

    GercekDost

    August 31st, 2007 3:48 am

    i’m intreasting in your theme,but i don’t know is the theme support chinese?your theme it nice,thank you

    0
  49. 149

    brad

    September 1st, 2007 7:59 pm

    Really great !

    0
  50. 150

    Rajaraman ramanujam

    September 4th, 2007 4:14 pm

    really a good things r here

    0
  51. 151

    magneti

    September 7th, 2007 10:22 pm

    Great collection of quality designs!

    0
  52. 152

    Dave

    September 20th, 2007 12:49 am

    Found this article while searching for some design ideas. I like the design by Olivier. Simple design and affective use of white (purple) space.

    0
  53. 153

    Fred

    September 20th, 2007 7:14 pm

    WoOo great list Sir, a great new source of inspiration for me, thanks ;)

    0
  54. 154

    Vitali

    September 21st, 2007 4:47 pm

    Great list, i’d wish i can create something like one of these..

    0
  55. 155

    Rich

    September 23rd, 2007 9:08 am

    A great collection of sites! Nice Work

    0
  56. 156

    bebek

    September 26th, 2007 9:01 am

    They are all great but a few of them looked absolutely excellent to me and those are the ones that I am probably gonna use for my new upcoming small projects. Thanks very much.

    0
  57. 157

    arkoudos

    October 12th, 2007 10:32 pm

    @im suden, you are totally right.

    Thats why i love watching this sites, but when it comes to work, i prefer Facebook – type usable sites…

    0
  58. 158

    Baltic

    November 21st, 2007 6:36 pm

    I think this material are very useful for new ideas. In Foxie and Kineda i found somethink new. Respect :)

    0
  59. 159

    isk

    November 22nd, 2007 7:08 am

    I`m happy, now website can be like a piece of art. There is some new design navigation ideas. Nice

    0
  60. 160

    Admin

    November 23rd, 2007 8:12 am

    I wish our website looks as awesome as those you selected.
    Wonderful collection.
    Keeping back for more.

    0
  61. 161

    Chase

    November 23rd, 2007 4:00 am

    Hey thank you so much for putting in all the effort to make this article. I show my clients this post all the time to help show them the possibilities of web design and what the current trend is out there. I have found this article extremely helpful and it has helped me recently land a new client. Thanks again!!!

    0
  62. 162

    Stop Foreclosure

    November 24th, 2007 8:57 pm

    nice work, I have been playing around with Photoshop and learning.

    -2
  63. 163

    Instafreak

    December 5th, 2007 11:15 pm

    Ok, we talking about nice design here, webdesign, and without no doubt this is nice collection of well designed web sites.
    Unfortunately some of this sites are miscoded, some of them badly miscoded…
    I have feeling that visitors of smashingmagazine.com have strong sense for correctly written code, so I was surprised when I saw sites without doctype ;(

    +3

  1. 1

    Jakob

    December 20th, 2006 5:34 pm

    Bullshit. Why is it always LOOKS over USABILITY?

    I mean there are hundreds of sites that “look nice” but are extremely difficult and tedious to use. Small text, radical colors and contrast, usage of Flash, required scrolling, useless images, too limited effective area without scaling support, non-standard solutions (= difficult to interpret what is a link/button) etc.

    The list goes on and on but yet many people deem such sites as incredible.

    +7
  2. 2

    Ramon Bispo

    December 20th, 2006 12:45 am

    Great stuff!

    +4
  3. 3

    Instafreak

    December 5th, 2007 11:15 pm

    Ok, we talking about nice design here, webdesign, and without no doubt this is nice collection of well designed web sites.
    Unfortunately some of this sites are miscoded, some of them badly miscoded…
    I have feeling that visitors of smashingmagazine.com have strong sense for correctly written code, so I was surprised when I saw sites without doctype ;(

    +3
  4. 4

    Russell

    December 20th, 2006 3:59 pm

    All these sites look eerily the same. I like clean gradients and tabs as much as the next guy, but the shit has to stop. It’s like the 45 degree angle thing during late 1999-2000. (Damn you 2Advanced!) There is nothing impressive about rehashing the same crap over and over. CSS+XHTML does not mean you site needs to look like a trendy web 2.0 logo.

    I’m not saying these are not good sites, because most of them are, but good design should look good 10 years later, and these will not. They are part of trend, like low-rise pants and bug-eye glasses. So take off you Von Dutch hat and think up some new ideas.

    +2
  5. 5

    Richard Brown

    January 14th, 2007 8:54 pm

    Beautiful sites maybe but not css based. Well this is in respect of one site anyway. The foxie.ru site is just images – placed in tables. It doesn’t even have alt tags. Waste of time and effort. It breaks if you try to make the images larger to read the text. The text is all images.

    To put it bluntly I can’t say it is beautiful or css based. So one out of your 50 is not really what you say it is!

    Rich

    +2
  6. 6

    Carlos Eduardo

    December 20th, 2006 2:07 am

    Impressive!

    It’s nice to see what we can do with CSS + XHTML but, surely, we need to have in mind that a semantic markup is VERY important to a successful site.

    +1
  7. 7

    asdf

    December 21st, 2006 3:48 am

    Mediocre. All sites have the same layout, all they changed are the images.

    +1
  8. 8

    tyler

    December 21st, 2006 6:12 am

    fun list but makes me think more of illustrator skills than css skills.

    +1
  9. 9

    Ashok Sanghi

    January 11th, 2007 5:16 pm

    Iam a webdesigner from india, i never expected this much of talent in the and cretivity peoples having, iam stunned see these websites, really amaging websites, cool colors and great combinations.

    +1
  10. 10

    gilles

    April 1st, 2007 11:47 pm

    It’s very great!

    +1
  11. 11

    bedava

    April 13th, 2007 3:36 pm

    They are really nice, photoshop and css they both perfect.

    +1
  12. 12

    raj

    July 9th, 2007 9:49 pm

    wow!!! nice collection of CSS based websites. the best thing is that you will find this website on top position (keyword: css based websites)

    thanx great links

    +1

↑ Back to top