Flat, simple icons for interface design

Here’s a bit of backstory on why I began hunting for icons, and a few thoughts about icon design in general. If you don’t care about that, skip to the roundup.

A few weeks back, a client remarked that they didn’t like the folder icon used in a project. At first I thought nothing of changing it. I own about a bajillion icons, and how hard could it be to find or design a folder icon?

As it turns out, finding quality, versatile icons is pretty hard, and designing my own is a nightmare. I should have known it wouldn’t be easy to whip up the perfect icon, having witnessed how Dan slaved over his Ballroom icons back in the day.

So, after scouring CandyBar for an hour and coming up short, I did what any modern girl does when confronted with a problem. I tweeted about it.

As usual, Twitter saved the day. I was reminded of a handful of old classics, and introduced to a number of new, gorgeous icon sets. I promised myself and the internet that I’d do a roundup of these icons. I then proceeded to promptly set the task aside and forget about it.

These icons would’ve remained buried in Simplenote, if not for Studiomate and all-around-fantastic-designer Mike Fortress, who sent me a nudge. (Thanks, Mike!) (Also, you should go buy his gorgeous slab-serif font, Deming.)

I usually can’t stand roundup posts (“Top 45 websites using green and yellow!” “Top 30 websites by people with vaginas!”). However, I’m hoping this post will actually help interface designers build a better toolbox, and will also give some much deserved business to the tireless icon designers of the world.

I can’t overstate the value of a good flat, sharp, detailed icon. You can style it any way you please, use it in a variety of projects, and communicate difficult interface concepts in a 16 pixel space. Considering the incredible amount of work that goes into designing each icon, and the quality exhibited below, these sets are scandalously low priced. So get ready to do some serious tax-deductible shopping.

Geomicons

Picons

  • $19 – $42, free social pack
  • Mix of outline and solid, elegant, good range
  • 300 icons
  • AI, PDF, EPS, CSH, PNG’s, and PSD
  • Made by Morphix: Twitter, Dribbble

Symbolicons

Bixel

Tabs

Gentleface

Iconic

  • Free
  • Blocky, thick, classic
  • 136 icons
  • PNG, SVG, OFT/TTF/EOT, Omnigraffle
  • Made by PJ Onori: Twitter

Glyphish

IconSweets

  • Donation
  • Detailed, crisp, lovely
  • 60 icons
  • PSD 32×32 and 16×16
  • Made by Yummy Gum: Twitter

IconSweets2

  • Donation
  • Detailed, crisp, lovely
  • 292 icons in 16×16, 400+ in 32×32 and 64×64,
  • PSD
  • Made by Yummy Gum: Twitter

Glyphicons

Pictos

  • $19 – $240
  • Versatile, simple, sharp
  • Loads of icons (couldn’t find exact count)
  • PNG, Font
  • Made by Drew Wilson: Twitter, Dribbble

The Noun Project

Chameleon

Gcons

  • Free
  • Detailed, versatile
  • 100 icons
  • PSD, PNG, GIF, JPG
  • Made by Greepit: Twitter

Pixelated

Eddit iPhone UI

Simplicity

Tipogram

Picas

  • $10 – $25, free social icons and sample pack
  • Simple, classic, versatile
  • 250 icons
  • vector
  • Made by Rok Benedik: Twitter, Dribbble

Helveticons

  • $259 – $439, free desktop and social icon sets
  • Flat, simple
  • 479 icons
  • PNG, PDF, EPS, GS, PSD, AI, CHS
  • Made by Goodbye Horses

Roam Design

59 Responses

  1. Great roundup, Meagan. I’m partial to the Geomicons and the full Pictos set, both of which are not only great for UI work, but wireframing as well. Sometimes clients need to see what an icon represents, and a little circle or box as a placeholder just doesn’t cut it. Dropping in a flat icon of a camera or a magnifying glass helps them get the idea, even if it’s not the exact icon that will end up in the final design.

  2. Laura says:

    Amazing collections, thanks for sharing. It’s one of those things where you know there are hundreds of icons out there to fit what you need, but you can never find them. This is getting bookmarked, thanks! :)

  3. Paul Mederos says:

    Couldn’t have written this at a better time… I was literally just looking for a solid icon set. Big fan of Eddit iPhone UI. Thanks Meagan!

  4. Rok says:

    Nice list, you should also check out for this set http://www.picasicons.com

  5. Dan says:

    Holy cow. Such a great list. One can never have enough simplistic icons to work with. Thank you.

  6. Pat Dryburgh says:

    Great list. May I also suggest Tipogram by Tom Creighton.

  7. Brian White says:

    Thanks so much. I have been hunting for icons like these forever on del.ico.us and other more filtered searches with no luck. These are great! Also I like simplicity: http://www.iconeden.com/icon/simplicity.html

  8. Marcus Lewis says:

    Great set of icons. I’ll definitely be putting this up on my Fun Friday’s section!

    Thanks for the list!

  9. sara cannon says:

    Thanks! How Great!!! I think these are pretty too
    http://blog.roamdesign.co.uk/?p=272

  10. Added Picas, Tipogram, Simplicity, Helveticons, and the Roam Design icon pack. Thanks for all the comments!

  11. Dan says:

    My wallet hates you.

  12. Cesar Torres says:

    I’ll consider this a list of icons I have to use. Am starting at the top and working my way down. Thanks for sharing the info!

  13. Anton says:

    hey nice post!
    check out http://iconza.com/

  14. Morphix says:

    Hey there, thanks for mentioning us. We’re very glad and thankful!

  15. Todd Dominey says:

    Great list. I wish more icon designers took the time to build fonts in addition to PNG, EPS, etc. There’s a huge need for symbols/icons that can be colored/styled via CSS instead of bitmaps. I’d buy all of these if font options were part of the package.

  16. Luke Dorny says:

    Very nice compendium, Meagan. Love it.
    Todd makes a great point. More and more I find myself ending up needing a font for these types of things…

    Marked as reference.

  17. Thanks for sharing, really nice assortment and a lot of hard work!

  18. Awesome collection! Thanks for digging all these up Meagan, I’ll have to keep these in my back pocket for future use.

  19. Thanks Meagan. Helveticons and Pictos are my saviour! :)

  20. I’m putting a vote in for seeing a round up of “Top 30 websites by people with vaginas!”The headline alone is hilarious, but a serious look at female web designers would be cool to read about.

    Oh, and awesome list too!

  21. Allie says:

    Bless you, Meagan! IconSweets just made some mockups, well, quite sweet, actually, and many of the others are now in my Springpad for future reference and use (when, like you, the bajillion icons on my computer come up lacking). Thank you!

  22. Philip says:

    I have a bunch of disorganized bookmarks with links to icon sets, but this is much easier to read and get a quick overview of. Really appreciate this.

  23. jess says:

    These are great! Thanks so much for putting them all in one place. Speaking of icons, thought you would enjoy this: http://grainedit.com/2011/08/03/tim-boelaars/. He has a nice owl icon in the mix, too.

  24. jess says:

    Here’s another link for the same fellow, with even more icons (looks like he is working on a set): http://dribbble.com/timboelaars

  25. Vincent says:

    Nice list Meagan :-)
    May I suggest my own minimal icons pack to make this list more complete : http://www.webalys.com/premium/design-vector-icons-library.html
    Thanks !

    PS : my favorite are the Geomicons than I bought, and that I use for works where I need a more human and warm look.

  26. Hamish says:

    Thanks Meagan! These are fantastic and I’m pretty sure will come in handy sometime soon. You had me cracking up with your “[...] people with vaginas” line.

    By the way, you mentioned Simplenote. I hadn’t seen that until now. How does it compare to Evernote? (I’ve been using that for a while.)

  27. Hi Meagan, I think the minimalistic icons of Dutch icon would look great in your list.

  28. R.Bhavesh says:

    This is indeed a great list.

    May we request to include the following two links that features total 250 free power glyphs.

    http://templatic.com/news/templatic-power-glyphs-iconset-freebie

    and

    http://templatic.com/news/free-templatic-ecommerce-glyphs-icons

  29. Lucy Woodman says:

    Thank you for this! Whenever I start a new project I find myself trawling through the internet looking for good icons. This is a great collection of links all in one place – super!

  30. Gabe says:

    Thanks for the roundup. This was helpful.

  31. “Flat, simple icons” were exactly what I was looking for this morning! Thanks for the save.

  32. Ray says:

    These are great, thanks! Also another possible inclusion: http://utilicons.com

  33. Wow, thrilled to be listed all these other great sets! Thanks!

  34. Josh Bryant says:

    Just a quick note that Pictos comes in quite a bit more formats than just PNG and Font. It includes .ai, .eps, and .csh as well.

    Thank you for the round up, it’s super helpful!

  35. Nick says:

    Great round up! Thanks for the detective work.

  36. Another vote for Dutch Icon. Really beautiful work.

  37. These icons are just amazing, very nice collection, thanks for sharing them here.

  38. Stewart says:

    Nice list, amazing icons.

  39. Stephanie says:

    Spectacular roundup, thank you! It always seem so hard to find the icon you need, when you need it. Bookmarked and thanks again!

Leave a Reply

See more in the posts archive