Build. Hack. Play. It's just what we do.

You know what icons are, right?

They’re those little graphics that communicate a concept. They can be used to embellish or anchor a design.

But icons can be tricky. If you have no formal design training, you might not be sure how to use them in a design. It’s easy to go overboard and use way too many icons, which makes for a cluttered design. When used right, icons look sleek, professional, and they make information easier to understand.


When it comes to using icons in your design, remember:

Use Icons Sparingly

Don’t overuse icons. Use icons to anchor text or to embellish headers. Try to avoid using more than one icon for one line or block of text.

Use Consistent Icon Styles

Use icons that have a similar design. For example, don’t use a couple of icons that are line art and a couple of icons that are filled in. Stick to one style so your design will be cohesive.


Use Contrasting Colors

Make sure that your icon stands out from the background (unless you’re using icons to create a background pattern). If the background is light, use darkly colored icons, and vice-versa. Use complementary colors so that they don’t clash.


Size Icons Consistently

Are you seeing a theme here? Consistency is key. Don’t use a couple of big icons and a couple of small icons—size them the same.


This infographic shows you seven hacks for pro icon design (even if you’re not a designer):


Share This Story

Get our newsletter