Designing for the Browser Tab: Favicon Best Practices

Every logo should pass the favicon test.

Open your browser right now. Look at your tabs. Those tiny 16x16 pixel squares are where your logo will live most often.

If your logo turns into an unrecognizable blob at that size, you have a problem.

The constraint that liberates

This constraint isn't limiting — it's liberating. It forces clarity. It demands you find the one essential shape that represents your brand.

Some of the best logos in the world are just letters. Or simple geometric shapes. They work at any size because they were designed with the smallest size in mind.

Technical requirements

Your favicon needs:

Clear recognition at 16x16 pixels
Works in both colour and monochrome
No fine details that disappear at small sizes

This is why wordmarks vs symbols becomes such an important decision. A wordmark might need a separate favicon mark.

Start small

Start small. Scale up. Not the other way around.

When preparing for a logo project, always think about where your logo will appear smallest. That's your true test of whether a design works.