Blog

50 Shades of Grey: 50 Website Designs That Forgo the Splashy Colors

50 Shades of Web Design

This post was originally published on 9/4/2012 and was updated on 2/17/2015.

Never has grey been so colorful.

After 60 million copies of the book "50 Shades of Grey” sold worldwide, and the movie grossed $81.7 million on its opening weekend, it seems we still can’t get enough grey matter in our lives.

While the E. L. James book, based on a fictional character with "fifty" mood swings and a serious bondage habit, has been translated  into over 30 languages, web design is something that never needs to be translated -  it is a universally spoken language of its own.

Of course, when it comes to custom website design most think that in order to "make it pop" you need multiple gradients and a variety of color. However,  sometimes with fewer colors and just a few shades of grey you can increase your visual hierarchy and balance in your layout.

In honor of the "Fifty Shades of Grey" theatrical release we've have found 50 websites from various countries that utilize black, white and grey (with maybe a splash of an accent color or two).

The common design elements in these websites are the use of bold typography that guides users though the website, large black and white images, drawings that utilize the negative space of the page, or to frame the content area in a visually pleasing manner.

Below are fifty excellent design examples that prove you don't need a lot of flashy colors to create an alluring design.

1. Kirschner Brasil

2. Tokyo Mild Foundation

Tokyo Mild Foundation Homepage

3. Roland Olbeter

Roland Olbeter

4. Urban Edge Design

5. Thirty Dirty Fingers

Thirty-Dirty-Fingers

6. Stylepit Lookbook

Stylepit Lookbook

7. Undercover

7_www_orbicule_com_undercover

8. Pixies

Pixies agence

9. The Noun Project

9_thenounproject_com

10. Marcin Kaniewski

11. Blissfully Aware

12. Information Architects

13. Piotr Świerkowski

Piotr-Świerkowski-2014

14. Leg Work Studio

14_2009_legworkstudio_com

15. Parallaxis

Parallàxis

16. Yara N Yared

Yara-N-Yared

17. Sold-Out

18. Non Stop Bar

Non-Stop-Bar

19. Misfit Creative

Misfit-Creative

20. Midwinter Light Up

Midwinter-Light-Up

21. Manuelle Gautrand Architect

22. Video Mapping Loops

Video Mapping Loops - BFM

23. Antidote

24. Rule of Three

25. Open121

26. Nouvelle Vague

27. Routalempi on

28. Lionel Durimel

Lionel-Durimel---Digital-Designer

29. Process Type Foundry

30. Afrobeat

31. Kenji Endo

KENJI-ENDO

32. Multitouch Barcelona

33. Jakob de Boer

Jakob-de-Boer

34. The Sum

35. Zero Fee

36. Peter Riedel

37. The Letter D

38.  Design Made in Germany

39. #Itouchmyselfproject

itouchmyselfproject

40. Square Space

41. Hashima Island

Hashima-Island--A-Forgotten-World

42. Tokyu Agency

43. Ego

44. SWE Film

45. Redirect Digital

46. Daniel Vane

Daniel-Vane

47. Joint London

48. Colorz

49. Kryptis

50. Never Bland

There you have it! Our top 50 websites that utilize many gradients of grey. Did we miss any of your favorites? Let me know down below or at @BFMweb.

5 Ways to Increase Your Website's Conversion Rate Whitepaper

Subscribe to
Our Newsletter

Comments

  1. Awesome and very inspiring collection! Like it :)
    Grey is my favorite color, so all this designs make me happy!
    Thanks!

  2. Brett Lewis said:

    Great post! Keeping sites confined to simple colors all within the same color family can be very effective and cool. I love all the sample sites. Very cool, very inspiring. Awesome!

  3. Jill Tooley said:

    Cool blog idea, Debbie! I don’t like gray (or grey, if you prefer) text for large chunks of content because it’s hard on my eyes, but I don’t mind when it’s used for headers and such. Of the examples here, I like #7 the best because the image is the focal point. And let’s face it, we’re all about pictures these days! :)

  4. These are always my favorite types of posts: lot’s of eye candy with a purpose. I love the concept of clean minimalistic design that allows for any saturated elements to really stand out without clashing against other colors. Sadly, most of my clients are opposed to greys : Anyways, great post!

Leave a Comment on this post

*
*