Flat Web Design. Whodunit?

Flat design is a concept that was extremely popular in the past, but today it is getting a reasonable facelift. Most of the redesigned and new websites use a flat design scheme - a trend that started appearing almost everywhere, both in websites and apps.

Once again, we can pay tributes to Windows 8. Due to its popularity, flat UIs climbed the top of the "fame tree". Google also contributed its share of flatness when flattened the design of its products. Keeping up to this idea, lots of major websites throughout the web promoted the idea of flat design.

Flat web design can be really attractive. It can't boast of a great amount of bells and whistles, though flat websites are perfectly doing what they are supposed to: deliver the message, promote your product or an idea.

What’s Flat Design?

Flat design is a method that does not use dimensional elements: no shadows, bevel, gradients, and other techniques that help create a 3D effect. Icons and UI elements are strict, without shadows. Abduzeedo has an awesome article about flat UIs in Windows Phone and iOS interfaces, feel free to check it out.

Still, flat design is not always completely flat. A great amount of websites, using this style, fall under the category "almost flat", where the look and the concept have pretty small amount of effects.


Make an emphasis on color.

This design trend often uses a lot of bright colors. It's recommended to use the colors of the logo to make the website really attractive. Flat scheme will work with all shades of black and white, but you'll be more using some more colors.

Dribble UI Kit


Free Square Kit


Focus on typography.

Words are important - they deliver a message to an end user, navigate them all around and tell what to do browsing the website. To create an interesting and beautiful typography, you can use Sans Serif fonts that have lots of variations. Remember, flat design is often simple and minimalistic so think twice before combining specific typefaces.

The Verge






Simple user interface and UI elements.

Buttons should not be over-complicated. When the elements are clearly visible and their function is obvious, they will be effective.

Flat UI


Smooth Web App


Free PSD Flat UI

Creating a hierarchy.

It's vitally important to create an intuitive hierarchy. Make sure that users can easily navigate and use your site without spending too much time pointlessly wondering around. The links should be clearly visible, have different colors, and they should be clickable, of course.

Android UI Kit


One Page


Search Engine


Flat Design - Inspiration

Now it’s time to check out some examples of live websites. To get some more inspiration you can surf through Dribbble or Pinterest. TemplateMonster's designers are also keeping up to latest trends and recently released numerous flat wordpress business templates, click the link to check them out.



Layer Vault


Lorenzo Verzini




Like There is No Tomorrow








I Think I Might


Eric Ford


Due to its simple "character", flat design best suits to convey the message or promote some products. This style is perfect for small screens, including mobile applications, but lots of people say that it looks cool on a big screen too.

For some, it may be difficult to stick to flat design, because one needs to focus on every detail. What's more, flat design can be blended perfectly with different colors. Finally, flat design means that all the effects are minimized.

SPEAK UP! Now it's your turn to spread some light on a flat design. Have you ever used flat layouts or dealt with them somehow? We would love to know your thoughts and experiences.

Alex Bulat

Writing a blog post or building a micro niche WordPress website is something Alex can do bare-handed. Also, he's running a catalogue with Ukrainian podcasts. You're welcome to contact him via Telegram or Facebook.

4 responses to “Flat Web Design. Whodunit?”

  1. Richard says:

    Amazing set Alex. You’re the best. Keep it up.

  2. Nihal Ozdereli says:

    olley 😀

  3. alexbulat says:

    Thanks guys @facebook-537664933:disqus @1df09d993e3db28519f8d749ad9f380b:disqus! Don’t go away too far, a lot of interesting blog posts are coming 😉

  4. Linh says:

    Thank you so much for this. It’s great!

Leave a Reply

Your email address will not be published. Required fields are marked *