Modern Element Trends In Minimal Webdesign of 2010

Title-minimal-trendy-webdesign-inspirationAs you may heard, I’ve been working on site redesign for a long time already and now I am deeply researching modern elements in minimal webdesign – I decided to share my research with all of you.

I think this modern&minimal trend will rule for some time, time for loud elements and web 2.0 cheap shiny badges has been long gone –  time for subtle emphasis, accents, big and stylish fonts, lightly textured backgrounds,grids, lots of negative space, usage of icons.

We cannot deny also huge technological possibilities with CSS3, HTML5, jQuery allowing you to do things which were impossible like 2–3 years ago. I also read IE6 is finally nearing extinction so we have one pain less from our shoulder and we can focus more on design and clean code!

What’s interesting this trend isn’t even minimal fully – while it has lots of white spice, you will still see some light textures, icons, bold fonts. Usually people called site minimal if it was just plain typographic, almost without any images and styling.  While researching new trending I must say plain minimal won’t work anymore if you really want to create modern design. Minimal isn’t just black text on white background anymore, while you still need to reduce design to the most important elements, you will improve design with a little more coloring,  minimal icons and very light textures.

You may be confused right now, but don’t worry – read further and I will show what I mean through real examples expressing modern design style in the best way possible! While I may not be so great into describing contents, try to pay attention and focus on important elements I mention and at the end of this article I am sure you will be fully charged with inspiration and understanding how to design your site using modern elements.

However this article isn’t meant for you to just get inspired to copy elements from other sites, but to understand where trending is going now. Maybe you will be the one to start new design trend? –  keep experimenting and never stop learning, good luck!

Before we start I would like to drop down the most important features of modern minimal webdesign style:

  • Lot’s of effective negative space
  • Grid based web designs
  • Clear, big typography
  • Lightly textured backgrounds and patterns
  • Subtle,minimal icons
  • Light shading and color transition, letterpress effect
  • Ribbons, sketches, dashed lines,ruler, transparent like backgrounds
  • Keypress navigation
  • Clear shapes
  • Old-school design combined with HTML5,CSS3 and jQuery
  • Animated mouseover effects
  • Colors –  usually monochrome with just one bright color to give little emphasis on links and titles.

Roger Burkhard

This is portfolio site of Roger Burhard who is web designer and developer featuring all the works he has been done here!

To describe his design style I have to quote his words:

“Hi, my name is Roger and I call myself a New School Designer which means I set great value on clear shapes, colors and typography. New School because I believe in the mix of design and technology. I love the challenge of simplifying complex information, to visualize and pimp them with the latest technology.”

I have to say his own words also describe current trending –  with all the tools, technology and information available we now can create designs much easier, you just need to put little thinking in to understand how to simplify our designs and codes even more using latest technologies.


Thomas Maier

I think Thomas Maier site design is excellent example to show minimal simplicity with modern elements. It is portfolio and blog for Thomas with sliding navigation and all content is on single page. Navigating through this site is really easy –  use main navigation and right bottom “back to top” button.

All elements are made easy to use, intuitive and design is amazing! Minimal icons, letterpress text effects, light shadowing!


Inspect Element

With huge buzz about new HTML5 and CSS3 collaborating with jQuery there is no surprise new effects have become one of the most popular modern trends! To understand what I mean mouseover to their logo and images –  logo is rotating and images has nice shadow, you can learn this effect in this tutorial if you want to recreate something similar.

Besides that Inspect Element blog has implemented few more design elements which are very popular right now –  I mean background behind logo, which is very well-recognized by designers who know how transparent background looks in Photoshop, paper boxes in the navigation also gives nice emphasis and clean look associating with clean paper.


Veerle’s Blog

Not long time ago Veerle created new site design (actually created completely new website to start fresh, but it’s another story) and her new design is a huge case of study with subtle beautiful design elements everywhere but in the same time keeping everything simple and clean.

I spent like 10 minutes just playing and researching all the great effects –  little 2/3 sec. mouseovers create a feeling that site has something magical in it. What I like the most is effectively used white space and font selection. Icons are minimal, but sometimes bright to bring right emphasis for RSS, Twitter or just making Jobs section more prominent in the middle section.

Check all sections of this site, little design ideas are sparkling everywhere here!


Project Fedena

Project Fedena is the open source school management system based on Ruby on Rails. It was initially developed by a team of developers at Foradian Technologies. The project was made open source by Foradian, and is now maintained by the open source community.

But from design point of view what makes this site stand out is light background resembling light paper and hand-drawn icons and buttons looking very realistic and natural.  Only two colors are used –  dark red and 2 variations of grey color, pretty impressive. Strong grid system and white space just emphasize right elements –  nice alternative to minimal icons, create minimal hand-drawn ones instead!



This website is owned by Kyee from England creating beautiful websites which are minimal, beautiful and modern, I checked his portfolio as well and I was impressed, I suggest you to do the same for further inspiration and study how modern design should look in 2010!

What’s impressive in this particular design –  it is simple, light without big design element, but it looks so professional!

At first there are just 1 main color (blue) used in different variations and that’s it, what creates that comfortable feeling when we visit Kyee portfolio page? A lot of white space –  design is so hard, because it’s so simple – every section gets the space it deserves.

Everything else is minimal –  even logo, really small font size, but headings really stand out to deliver the message.

Impressive portfolio and skill!


I just couldn’t stand and exclude this beautiful piece of art! Light noise added, nice separator with subtle logo and input fields also get well deserved space making hard for you not to start typing your contact info automatically!



Liam from WeFunction just finished his design on WPBundle which will be shop for bundle of webdesign candies like 10 WordPress themes, icon sets and various other useful goodies, but to make this work of course professional site is necessary to prove their skill and create sales.

Since Liam and his team are really experienced they’ve put together amazing site – both from design and functionality point of view. In the screenshot also we can see how light texture is used to resemble with Twitter sky, but really such little elements rule the world now. Watch out for subtle dashed lines, calm buttons and little colors.

Emphasize just what you really need!


They Make Apps

But what if you want to create minimal site, but it is almost impossible because of all the functions and links you need to include in your design?

Create design –  black&white, at least almost, using less is more even in colors!

TheyMakeApps website has recently won Webby and SXSV awards –  it is online shop for mobile apps and also hanging place for all app makers dying to earn some money for good work.

You will notice here several trends –  boxed background, precise logo ( by precise I mean it has been measured, which is popular trend lately too) and of course keep icons minimal using just color.


Simple Bits

SimpleBits web agency designs and builds simple, usable, and attractive interfaces that account for speed, file size, readability and accessibility — using web standards and also it has interesting blog in the meantime.

But now about design –  little ribbons are gaining popularity as well, forget about web 2.0 colored badges –  use them as naturally as possible. SimpleBits logo sits nicely on red ribbon, where it resembles with real bookmark we used to put in our books. Use natural colors and get resemblances in visitors – create deja-vu with real life.

Beautiful typography is definitely an important element here and notice CSS3 2–3 sec color variation on mouseovers in links!



Delibar is a full featured Delicious and Pinboard Mac client. Delibar focuses on giving Mac OS X users an easy and quick tool for searching, managing and sharing their bookmarks.

Looks like there is not any modern and great looking webdesign imaginable without self descriptive icons  as one of the main graphic design elements.

Light radial gradient, shadows,  1 px thin lines, strokes and of course beautiful typography with subtle letterpress effect. Even design element behind “Pinboard Flavor” is really calm and almost unnoticeable.


Design Swap

Site has interesting idea to bring community together by redesigning each others website.

By Trent Walton words:

“DesignSwap’s sole purpose is to promote collaborations between designers by saying one simple thing – I design on your site, you design on mine”.

I am curious how this project will work out and suggest you to join in to create new friendships and grow your experience, but now about design.

All the main elements are in the “above the fold” section showing branding and which artists are now exchanging and doing redesigns. Both circles have nice mouseover effect. Make notice on subtle texture (which is not noise in this case),many subtle letterpress effects on text and icons.

Red ribbons and sketched characters seem nostalgic and odd at the first time, but little CSS3 effects clearly show you designer knows about latest technologies and trends!


Yaron Schoen

This is personal portfolio site of Yaron Schoen, designer based in NewYork. It’s important to create the first impression good and here by quality chemistry icon expression and slogan you get immediately introduced with Yaron’s world. Design shows he is confident about his skills and while browsing his site you will also feel his experience.

But what about modern trends? Logo is minimal, even loud header uses as little graphics and colors as possible. All design is kept clean and grid based, I almost feel the most white space you will be using, the better results in the most cases you will get. Just don’t exaggerate or maybe you need to do exactly that!?


Design Informer

I couldn’t exclude this great design blog from this collection since I consider Jad Limcaco design is pure greatness including simplicity in such complex website.

Navigation and input boxes has nice mouseover effects using CSS3, header has subtle graphic to make it more interesting –  there are many little and subtle design elements you will not notice immediately, but it all together feels natural. You just have to notice those elements, use them in your own designs letting visitors enjoy information you want to deliver.

Nice element is that little ruler separating content section from sidebar –  small things matter!


Uh and did I mention this valuable art directed post teaching how to use grids to achieve clear separation of content.


Hot Meteor

Hot meteor is web agency which specializes in web, print, and branding. Design is kept really minimal and interesting it has been centered, which is unusual practice. Transparent gradient in the static header also gives nice scrolling experience!


Crush Lovely

Not used a lot just yet, but I am sure keypress navigation will gain huge popularity in future to let visitors switch categories and slide images easier. When I used keypress navigation here with left/right arrows in this single page design it was really great experience to slide through different backgrounds and styling in elegant way.


Usable Efficiency

Very valuable video tutorial site teaching you how to improve and design websites. Author got very clean and professional site designed with him, you an expand extra info –  such as comments and description about video just if you choose to.


Arty Papers

Portfolio site by R. Marie Cox, here besides white simplicity I like tiny small logo and navigation –  looking great! Just for fun, check his 10 previous site versions in the footer, interesting evolution through years!


i-Design Studios

iDesign Studios is a web design and development company specializing in creating custom web sites, focusing primarily on custom WordPress theme design and development.

Look how dashed lines do all separation and not a single bright color is used? Check out also interesting feature to switch to dark/light theme –  it’s  nice to see they think about reader by offering little personalization options



Personal portfolio page by Francesco Fonte, nice addition to site is percentage skill graph, where he measures his own skills by percent. I couldn’t avoid to notice subtle background texture and light “more” –  such eye candy!


Monty Lounge Industries

This is a portfolio site created by experienced web designer Kevin Fricovsky and huge titles do make an impression!


Dustin Allen Pace

Portfolio website of 23 years old web designer Dustin and this is his showcase site. Play with navigation to enjoy light mouseover sliding.



Pixelumbrella is the online portfolio of Seattle-based web designer and developer Nick Robinson.


5 Squared

Single page portfolio website – definitely saves clicks and some of the expensive time!


Skylar Anderson


Jason Duerr


THG Creative



This is personal blog and portfolio site by Florian Pichler from Deutchland. What I liked here was little font size –  maybe for bigger resolutions it would be too small, but for my laptop it was just the right way! Interesting –  everything is small, but white space is used in the right way and that’s what makes it feel and look so good I think.

Great design element here is animated navigation too with sliding ribbons on mouseovers and active sections.


Jeroen Homan


David Kim

Very light and simple yet professional single paged web designer site, love the clean sight!




A Dfferent Design









While header might contain a little bit too much information, but light content section is just plain brilliance –  light mouseover effects, little icons and dashed lines. Thoughtful design.


Nice Reply




Just A Lab






Mark Palma

Interesting feature in this site subtle background icons behind content – such icons affects readability a little bit but definitely interesting touch of design and idea


Brett Chaney


Render Wave

This website stands out with its really interesting perspective slider, check it out!


Adam Woodhouse


Dainis Graveris

Dainis is 25 years young man, who struggled for 3 years while studying in design academy and working for local design agency, because of ignorant teachers and agency boss. He couldn't believe this is all life could offer to him! And then he discovered true Internet possibilities, he was lucky to find his passion early in life and take advantage of this beautiful Information (Internet) Age! Now he is committed to help others succeed, to help others take charge of their life and follow their passion! His goal is to open Your eyes and help unveil Your true potential!

15 Smart Tools To Help You Build Your Freelance Business

Discover the awesome tools we use in making our clients comfortable and happy in learning new things every day.

Download Now


  1. Tony says

    Great inspiration here, just starting out I tend to throw everything against the wall and see what sicks, I take away what doesn’t work. These sites are great examples of great clean design.
    Thanks for all your hard work, I will be revisiting these sites for inspiration :)

  2. Lisa says

    I love the simplicity of minimalism. It’s so easy to want to over design something, great collection. LT

  3. Oscar says

    Whoa! Some much good inspiration on this blog.

    Going to book mark this page as a reference.


  4. says

    Really nice collection you’ve brought together. As a designer, sometimes hard to convince a client that simple is often better, especially since much of the web tends toward “American Baroque.”

    • says

      I completely agree with you. At presentations of layouts for websites, clients often like simple and clean layouts but then lose courage to decide for such a design. Instead they wish to fill the “empty space”, to place a box with the latest promotion, some news (that they later never update) or what was my worst case, to place a clock.

  5. Joe says

    I like the selection of site which is made in your post. This article is a very good source of inspiration to make sites with an elegant and modern sober design at once !

  6. Pacheco says

    Really nice round up…I really love the simplicity, but isnt so simple to make it simple… if you know what i mean :D

    Great examples and great designers metioned here.

    • says

      hehe, definitely – to make such took a lot of knowledge and time for me too and still huge room for improvements..:) but great learn from :)

  7. Dave W says

    These are all very nice! I’m a big fan of minimalistic sites. Knowing when to stop and how to keep it simple is an art in itself.

  8. Jarkko Sibenberg says

    I welcome this trend with open arms. Anyone can make a site that shouts its message at visitors with bright colors, but It’s always more satisfying when you manage to say more by saying less. You can also guide your visitors with more subtle ways if you keep your design and structure clean and simple.

    Thanks for including some more complicated site examples as well.

    • says

      That’s what I am saying – completely agreed! I am always now asking myself if I really need some elements – and put them only if I really cannot live without them.

      Yes, I love myself those little bit complicated sites, but still keeping it minimal – plain minimal is much easier to create comparing to those sites featured here.

    • says

      Hey, Hiren! I am sorry for rare posts lately but I’ve got completely busy with academy works and redesign which will bring a lot of exciting things in future.

      And thanks, now I can afford to work even more on unique article quality :)

  9. says

    Beautiful sites and a great quote i did not heard of : “Design is so hard because it’s so simple” !

  10. says

    So many great website designs but think my favorite would have to be the first example by Roger Berhard, as really love the creative use of type. Thanks for sharing.

  11. Cosmin Negoita says

    Nice showcase, indeed. Well Dainis, I hope that you’ll create a very awesome design for this nice blog. The current design is kinda old-skool. Good luck!

    • says

      I hope the same, working really a long time already into this redesign, slowly it’s going close to being complete :) Keep updated..we will start coding it in next week hopefully and wait for sneak peeks :)

  12. Adie says

    Great collection of minimal sites here. I have to say that my favourite is the site designed by Kyee. Not only is the quality of the site amazing but your right the rest of his work is as well.

  13. says

    Thanks for the mention of Usable Efficiency, Dainis.

    A pleasure to be listed amongst some great sites. Some of which iv bookmarked myself.

    Look forward to seeing your redesign.

    • says

      My pleasure John! I am big fan of your videos ever since I found your great blog! :) Will keep visiting your site :)

      After a week we will start coding part, so hopefully if won’t take too long to finish this project :) Thanks for support.

      • Arshad Cini says

        Why don’t you give us some screenshots about the new design Dainis:)

  14. Melody says

    I love the restraint of minimalism. It’s so easy to want to over design something.

    • says

      Exactly! Same is with design elements – usually we just include things we just don’t need really!

      I liked when I found quote – “Design is so hard because it’s so simple” :)

  15. says

    Some great examples of minimalist designs.
    Good to see some designs from people I know being featured in the list.


  16. says

    The move to larger typography and imagery is good for everyone consuming info on the web… nice collection!