Skip to content
pixvertoPixverto

How to Make a Favicon for Your Website

A favicon is the small icon in the browser tab. It makes your site look professional and easier to find among many tabs. Here is how to make one properly.

Start with the right source image

Use a square picture of at least 512 × 512 pixels, or an SVG. Choose a simple shape or a single letter. Fine detail disappears at 16 × 16 pixels, which is the size shown in most browser tabs.

Which files do you need?

A modern setup needs favicon.ico (16, 32 and 48 pixels inside one file), a 32 × 32 PNG, an apple-touch-icon.png of 180 × 180 pixels for iPhones and iPads, and 192 and 512 pixel PNGs for Android and installable web apps.

The Favicon Generator on this site creates all of them from one picture and gives you the HTML to paste.

Install it

Upload the files to the root folder of your website, so that /favicon.ico works, and paste the link tags into the head of every page. Many website builders have a favicon field in the settings, so you only need to upload one image there.

Why isn't my new favicon showing?

Browsers cache favicons aggressively. Open the site in a private window, or add a version to the URL, such as /favicon.ico?v=2, and refresh a few times. Search engines can take days or weeks to pick up a new icon.

Try the tools