Favicon Generator — Make a Favicon
Last updated: 2026-06-25
Images never leave your device · 100% client-sideThe favicon generator turns an image or logo into browser-tab, home-screen and PWA icons at 16, 32, 180 and 512px PNG in one click.
Rectangular images are center-cropped to a square and redrawn at each size, all processed on a canvas in your browser.
Favicon Tool
How to use
- Select an image — Upload a near-square image or logo to turn into a favicon.
- Generate sizes — 16, 32, 180 and 512px PNGs are generated automatically at once.
- Check previews — Review each size. Simple shapes read better at the smallest sizes.
- Download — Download each size you need and add it to your site.
What a favicon is and which sizes you need
A favicon is the small site icon that appears in browser tabs, bookmarks and home-screen shortcuts. The size you need varies by device and use, so it is best to produce several sizes from one image. This tool center-crops a rectangular image to a square and redraws it at each size.
Recommended favicon sizes and uses
| Size | Use | HTML |
|---|---|---|
| 16 × 16 | Browser tab (low-res) | rel="icon" |
| 32 × 32 | Browser tab (high-res) / taskbar | rel="icon" |
| 180 × 180 | iOS home-screen icon | rel="apple-touch-icon" |
| 512 × 512 | PWA / Android install icon | manifest.json |
Small favicons lose detail, so a simple, high-contrast design works best. To square up a logo, use crop image; to tidy the background, make a PNG with image converter first.
Frequently asked questions (FAQ)
Which favicon sizes do I need?
Browser tabs use 16px and 32px, the iPhone home-screen icon (apple-touch-icon) uses 180px, and PWA/Android use 512px. This tool generates all four sizes at once.
What ratio should the source image be?
A near-square (1:1) image works best. Rectangular images are center-cropped to a square, so keep the important elements in the middle.
How do I apply the favicons I made?
Add them to the HTML <head> like <link rel="icon" sizes="32x32" href="favicon-32.png"> and <link rel="apple-touch-icon" href="favicon-180.png">. 16/32px go on tabs, 180px on iOS, and 512px in the PWA manifest.
Is my image uploaded to a server?
No. Favicon generation runs 100% inside your browser, and your image is never uploaded or stored.
Related tools & guides
Last updated: 2026-06-25