20 Excellent Examples of Icon Usage in Web Design
Here on WDL we love icons! From Icon Tutorials to a list with the Best Free Icon Sets of 2010 and a 15 Must-Have Minimalist Icon Sets, we already showcased a lot of great icons around here to boost your inspiration. Today we decided to gather some examples of icon usage in web design to show you how icons can make a difference in a layout, giving a page a nice touch, in both interface and experience. Check out the examples we got and start to think about giving icons a new try on your next design.
Clarity – Clean Portfolio WordPress Theme
Movmt Studio
I am Tiago
B3 Studios
Worry Free Labs
Studio Nudge
Peter Nappi
iMyGarden
Cake Sweet Cake
AppVita
Keith Cakes
Square
photovine
enixel
Grégory Sujkowski
Syropia
Clases Inglés Madrid
claimtz
Pandr
Moredays
Source:
The Best Designs
Site Inspire
Sites of the Week – Abduzeedo
About the Author
I love communication, technology, web, design, movies, gastronomy and creativity. Web writer, portuguese/english translator and co founder of @refilmagem & @mentaway Twitter: @gismullr
Related Posts
Here's some other articles that you will definitely find useful.
18 Websites that Take Scrolling to the Next Level
Inspiring Type in Package Design
Flat Design Inspiration
21 Beautiful Examples of Using White in Web Design
23 Examples of Flat Web Design
21 comments
web design company uk
July 18, 2011Nice collection of web design icons.. i really like “Cake Sweet Cake” web design icons.. keep sharing more with us..
mrigesh
July 31, 2011yeah right
mrigesh
July 31, 2011weay to go
Evan Skuthorpe
July 18, 2011nice collection. some great sites.
Tristar Web Design
July 18, 2011These website all show the icons wonderfully. They seem to give out the most appeal when they appear on clean basic sites with very little photographic imagery. I really like ‘I Am Tiago,’ ‘Studio Nudge’, ‘Enixel’ and ‘Syropia’. All of them use icons really well and to the sites advantage.
Pragmatic Design
July 18, 2011At the risk of blowing our own trumpet, our website uses some nice illustration-style icons. Check out http://www.pragmaticdesign.co.uk/services/ and the dropdown menus.
Gabriel
May 2, 2012Thanks for the link, you were right a nice design.
Boost Inspiration
July 18, 2011great examples of icons in web design.
Nils
July 18, 2011Thanks for that nice collection.
One more example with fotorealistic icon in the main navigation:
http://www.archaeofirm.de/
Creative Girl
July 18, 2011Thanks for the great web design ideas! I loved the attention to clarity!
Mr.Gaz
July 18, 2011Some great websites here…love “I am Tiago” & “Peter Nappi”!
Simon
July 18, 2011My wife came across this site and loves the childlike, hand drawn icons. http://www.toshi.com.au
Kristam Moffett
July 18, 2011Lovely stuff – I’m seeing some trends develop for 2011 that are rather beautiful!
Brenne Meirowitz
July 19, 2011Peter Nappi’s website is a piece of art unto itself. It is one of the most stunning websites I’ve ever viewed!
Russell Poulter
July 19, 2011Nice round up, thanks!
Templamatic - Lex Koff
July 19, 2011I adore icons as they are informative and appealing =) Presence of well drawn icons would be one of the signs of usability for me =)
Peter Arnhem
July 24, 2011Thnaks for the list, i love the “Peter Nappi” design.
Peter
Webchemie
Tomasz Dudek
August 9, 2011i got some new ideas.. thank u very much fot this
Dutch icon designer
August 11, 2011This is exactly how I like my icons, clean and simple. Very useful list.
Gabriel
May 2, 2012I would like to add my 2 cents. I have recently been busy browsing and adding free icons to http://www.creattor.com. They are royalty free – everything I added was free for commercial use. You could try getting some icon packs and make your own template, like the sites above.
Danielle
May 10, 2012We create our own custom icons too. What do you think? http://www.unleadedsoftware.com/capabilities