WordPress Favicon Generator
WordPress does not want a folder of icon files. You upload one square image as the Site Icon, and core crops it into the sizes it serves and prints the link tags into every page.
One upload, four tags
The Site Icon is a media library attachment like any other image. When you set one, WordPress crops it to a square, generates the sizes it needs, and stores them as regular uploads with a cropped- prefix on the filename.
From then on, core prints the icon markup into the head of every front-end page and into the admin. You do not write link tags, and you do not need a plugin. A theme that also hardcodes its own icon tags will fight with this, so check the rendered HTML if you see the wrong icon.
Setting the Site Icon
- 1
Open the Site Identity settings
On a classic theme: Appearance, then Customize, then Site Identity. Block themes hide the Customizer, so the setting moves into the site editor or the general settings screen depending on your version. Searching the admin for 'Site Icon' is faster than hunting menus.
- 2
Upload a square image at 512x512 or larger
WordPress rejects anything smaller. It needs the headroom because the largest size it generates from your upload is bigger than a browser tab icon.
- 3
Crop to the square you actually want
The cropper opens even for an already-square image. What you confirm here is what every generated size is cut from, so nothing you leave near the edges survives.
- 4
Publish, then clear caches
A page cache plugin or a CDN will keep serving the old HTML, and the browser caches favicons separately from pages. Load the site in a private window before concluding it didn't work.
What WordPress prints for you
<link rel="icon" href="/wp-content/uploads/cropped-icon-32x32.png" sizes="32x32" />
<link rel="icon" href="/wp-content/uploads/cropped-icon-192x192.png" sizes="192x192" />
<link rel="apple-touch-icon" href="/wp-content/uploads/cropped-icon-180x180.png" />
<meta name="msapplication-TileImage" content="/wp-content/uploads/cropped-icon-270x270.png" />Simplified from a real page. The filenames carry your upload's name; the sizes are fixed by core.
The sizes core generates
| Size | Purpose | Consumed by |
|---|---|---|
| 32x32 | Standard tab icon | Desktop browsers |
| 180x180 | apple-touch-icon | iOS home screen |
| 192x192 | Larger PNG icon | Android, Chrome |
| 270x270 | Windows tile image | Legacy Microsoft surfaces |
WordPress favicon FAQ
Why does WordPress insist on 512x512?
It generates sizes up to 270x270 by cropping your upload, and it will not upscale. The 512 floor guarantees every generated size comes from real pixels rather than a blurry enlargement.
I changed the Site Icon and the tab still shows the old one.
View source and look at the cropped- filename in the icon link. If it points at the new attachment, the HTML is fine and you are looking at a cached favicon. Browsers cache those aggressively and independently of the page. If it points at the old attachment, your page cache or CDN is stale.
Do I still need a favicon.ico with a Site Icon set?
For browsers, no. They read the link tags. Some feed readers, crawlers, and older clients still request /favicon.ico by path and never look at your HTML, so a file at the domain root is a cheap safety net.
WordPress favicon not working?
The two ways it fails on WordPress, and the exact cause of each.