What are the options?

There are a number of options that a designer can take when applying a logo design to a favicon. Below are three ways to convert your logo design to a favicon successfully.

1. Show the Full Logo or Optimized Variation

If the original logo is simple enough this is a great option. It is very likely that the original mark is too complex to accurately render at such a low resolution. It is also recommended that the vector mark be adjusted to better fit the low resolution of the icon, for more information see the article Icon Design Explained by icon design expert Jon Hicks.

2. Show a Segment

Often times when the mark is too complex to use in its entirety, a small yet distinguishable portion of it may be used instead. Doing so creates a visual reference to the mark and identity without having to attempt and fit complex detail into such a small area.

3. Pull Away from the Identity

It is also entirely possible that the favicon can be treated as an entirely new design problem. In this scenario it is common to see the overall identity of the company / service / product applied to the favicon in an entirely new way.

FavIcon Examples

Below you will find some examples of the options mentioned above.

1. Full Logo & Optimized Variations

Hick’s Design - http://www.hicksdesign.co.uk/

37signals - http://www.37signals.com/

FANCAST - http://www.fancast.com/

Coudal Partners - http://www.coudal.com/

2. Segments

Ars Technica - http://www.arstechnica.com/

Twitter - http://www.twitter.com/

Nintendo - http://www.nintendo.com/

GOOD Magazine - http://www.good.is/

3. Identity Extensions

Makefive - http://makefive.com/

Facebook - http://www.facebook.com/

Flickr - http://www.flickr.com/

XBOX - http://www.xbox.com/

Have you forgotten about your favicon?