Favicon best practices
A good favicon is square, simple enough to read at 16 pixels, and linked from your home page at an address that doesn't change. Start from the bold one-letter design below and adjust it to your brand.
Free, no sign-up. Runs in your browser. Nothing you type or upload is sent to us or stored.
At a glance
- Shape
- Square (1:1), at least 8 × 8 px; Google recommends larger than 48 × 48 px
- Source: developers.google.com, checked 2026-11
- Address
- Keep the favicon URL stable; don't change it often
- Source: developers.google.com, checked 2026-11
- Crawling
- Googlebot must reach your home page and Googlebot-Image the favicon file; neither may be blocked by robots.txt
- Source: developers.google.com, checked 2026-11
- One per hostname
- example.com and news.example.com can differ; example.com/news can't have its own
- Source: developers.google.com, checked 2026-11
- Apple touch icon
- 180 × 180 or 192 × 192 px, with a background that isn't transparent
- Source: developer.chrome.com, checked 2026-11
Give your page its own icon
An uploaded site at yourname.liite.site can use these files as they are: drop them in your site's folder next to index.html. Liite pages come with a share image and a QR code of their own.
Favicon best practices: what to know
This page starts the favicon generator for this case. For every option and how to use it, see the favicon generator.
Favicon examples and ideas that work
Most good favicons fall into four groups. One letter on a strong colour, like this preset. A two-letter monogram for names. An emoji or simple symbol for side projects. Or the main shape of your logo with the words taken out.
What they share is one shape and two colours with strong contrast. Fine lines, small text and gradients don't survive at tab size, so leave them for your full logo.
Checklist before you publish
Look at the 16 px preview, not just the big one. Put the files at your site's root, link them from every page's head, and keep the same file names when you update the design so the address stays stable. Browsers and Google can take time to pick up a new icon.
Questions
How do I create a good favicon?
Keep it to one bold shape or one or two letters, use two colours with strong contrast, and check it at 16 pixels before you download.
What are the recommended favicon sizes?
16 and 32 px PNGs and a favicon.ico for browsers, 180 px for Apple devices and 192 and 512 px in the web app manifest. This tool makes all of them.
Why isn't my favicon showing in Google?
Google has to recrawl your home page first, which can take days or weeks. Check the favicon is square, linked from the home page and not blocked by robots.txt. Even then, Google says it isn't guaranteed to appear.