A favicon is the small square icon you see in a browser tab, next to the page title. It also shows up in bookmarks, browser history, and the little tiles people see when they pin your site to a phone home screen. The word is short for "favorite icon," and while it is one of the smallest things on your website, it does a surprising amount of quiet work for your brand.
If your tab currently shows a blank page icon or a generic globe, you are leaving a small but real impression on the table. In this guide we will cover what a favicon is, why it matters for a small business, and exactly how to add one, no coding background required.
What a favicon actually is
A favicon is a tiny image file, usually square, that browsers display in places where there is only room for a symbol and not your full logo. Think of it as your brand shrunk down to its simplest form.
You will see your favicon in a few spots:
- The browser tab, next to the page title
- Bookmarks and the "favorites" bar
- Browser history and autocomplete suggestions
- The home screen icon when someone saves your site to their phone
- Some search results and link previews
Modern browsers support favicons in several formats and sizes, but the good news is you usually only need to upload one good square image and let your platform or a free tool generate the rest.
Why a favicon matters for a small business
A favicon will not win you a customer on its own. What it does is add a layer of polish that makes your business feel established and cared for. When someone has eight tabs open and yours is the only one with a proper icon, your site stands out and feels easier to return to.
It is one of those details that quietly separates a site that looks finished from one that looks half-built. If you care about what makes a website look professional versus cheap, the favicon belongs on your checklist right alongside clean fonts and good photos.
There is a practical benefit too. People who bookmark your site or keep a tab open are often repeat visitors or warm leads. A recognizable icon helps them find you again in a crowded browser. That small recognition adds up over time.
Tip: Your favicon should be the simplest possible version of your brand. A single letter, a symbol from your logo, or a bold monogram reads far better at tiny sizes than your full logo with text squeezed in.
How to design a favicon that reads well
The biggest mistake people make is trying to cram their entire logo into a 32 by 32 pixel square. At that size, fine detail and small text turn into mush. Keep it simple.
- Start with one strong element. Pull a single icon, shape, or initial from your existing branding.
- Use high contrast. A clear shape against a solid background holds up better than something busy or low-contrast.
- Match your brand colors. The icon should feel like it belongs to the same family as your site. If you have not locked those in yet, our guide on how to choose colors for your small business website is a good place to start.
- Make it square. Design on a square canvas so nothing gets cropped awkwardly.
- Test it small. Zoom out until the image is tab-sized and ask yourself if you can still tell what it is.
If you do not have a designer, free tools like Canva let you build a simple square icon in a few minutes. You do not need anything fancy. A clean initial on a colored background works great for most small businesses.
Favicon sizes and formats, made simple
You might read conflicting advice about which sizes and file types you need. Here is a practical breakdown that covers nearly every situation.
| File | Size | Used for |
|---|---|---|
| favicon.ico | 16x16 and 32x32 | Classic browser tab icon |
| PNG favicon | 32x32 or 48x48 | Modern browsers |
| Apple touch icon | 180x180 | iPhone and iPad home screens |
| Android icon | 192x192 and 512x512 | Android home screens and app-style tiles |
The simplest path is to upload one high-quality square image (512x512 pixels is a safe starting point) to a free favicon generator. It will spit out every size and format you need, plus the code snippet to add them. You do not have to make each file by hand.
How to add a favicon to your site
How you install a favicon depends on how your site was built. Here are the most common routes.
On a website builder or platform
Most modern builders have a favicon setting built in. Look under site settings, branding, or general settings for a field called "favicon" or "site icon." Upload your square image, save, and the platform handles the rest. This is the easiest option and covers most small business sites.
On WordPress
WordPress calls the favicon the "site icon." Go to Appearance, then Customize, then Site Identity. Upload your image under Site Icon, and WordPress will generate the needed sizes automatically. No plugin required.
By editing your site's code
If you manage your own HTML, upload your favicon files to your server, then add a few link tags inside the <head> section of your pages. A favicon generator will give you the exact lines to paste. If you are hand-coding, it also helps to understand your overall website structure so the files live somewhere sensible.
Whichever route you take, add checking your favicon to your website launch checklist so it does not get forgotten before you go live.
Making sure your favicon shows up
A common frustration is adding a favicon and still seeing the old one, or no icon at all. Browsers cache favicons aggressively, so changes do not always appear right away.
- Clear your browser cache or open the site in a private or incognito window to see the current version.
- Give it some time. Caches can take a day or two to fully refresh across devices.
- Double-check the file is actually square and not corrupted.
- Confirm the file uploaded to the right place if you added it by code.
If you want to be thorough, you can run through our website self-audit and treat the favicon as one more small thing that makes your site feel complete and trustworthy. Details like this are part of the same mindset that builds a site people take seriously, which ties into good small business website design overall.
Frequently asked questions
Does a favicon help with SEO?
Not directly. A favicon will not change your rankings. That said, Google does display favicons next to some mobile search results, so having a clean, recognizable icon can make your listing look more trustworthy and may earn a few extra clicks. The real value is brand recognition and a polished, professional feel.
What size should my favicon be?
Start with one high-quality square image at 512x512 pixels and run it through a free favicon generator. That one file lets the tool produce every size browsers and phones need, from the tiny 16x16 tab icon up to the larger home screen tiles. You do not need to create each size yourself.
Can I use my logo as my favicon?
You can, but usually only part of it. Full logos with text become unreadable at tab size. Pull out a single symbol, icon, or your first initial instead. If your logo is already a simple mark, it may work as is. When in doubt, shrink it down and see if you can still tell what it is.