Favicon Generator
Upload any image and generate a complete favicon package: ICO, PNG sizes for all devices, and the HTML code to paste.
Drop an image here or click to upload
Supports PNG, SVG, JPG
How to use
- 1 Upload your source image (square PNG, SVG, or any image) by clicking or dragging into the upload area.
- 2 The tool generates all 6 standard sizes: 16×16, 32×32, 48×48, 180×180, 192×192, and 512×512.
- 3 Download individual sizes or click "Download all as ZIP" to get all files at once.
- 4 Copy the generated HTML <link> snippet and paste it into your website's <head> section.
Key features
- Generates all 6 standard favicon sizes from a single source image
- Download individual sizes or all as a ZIP in one click
- Includes the full HTML <link> snippet for your <head> section
- Supports all common image formats as input
What is a Favicon?
A favicon (short for favorites icon) is the small icon that browsers display in tabs, bookmarks, and the address bar. It was introduced by Internet Explorer 5 in 1999 and has since evolved from a simple 16×16 ICO file into a family of assets required by different devices and contexts.
Modern browsers, iOS, Android, and PWAs all expect different sizes and formats. A proper favicon package includes the classic favicon.ico, PNG variants for retina displays, an Apple Touch Icon for iOS home screen shortcuts, and larger PNG files for Progressive Web App manifests.
Common Use Cases
New website or web app launch
Upload your logo or icon and get the full set of files plus the HTML <link> tags to paste into <head>.
Progressive Web Apps (PWA)
PWA manifests require 192×192 and 512×512 PNG icons. This tool generates both sizes automatically.
iOS home screen shortcut
The Apple Touch Icon (180×180) is what appears when a user saves your site to their iPhone home screen.
Rebranding or logo update
Regenerate the full favicon set whenever a client updates their logo without manually resizing in Figma.
Side projects and prototypes
Quickly put a proper favicon on a side project without a full design workflow.
Getting the HTML snippet
Get the exact set of <link rel="icon"> and <link rel="apple-touch-icon"> tags to copy into your HTML head.
Complete Favicon Package Reference
The files needed to cover every browser and device type.
| File | Size | Used by |
|---|---|---|
| favicon.ico | 16×16 + 32×32 | All desktop browsers, tab icon |
| favicon-32x32.png | 32×32 | Retina displays, pinned tabs (Safari) |
| apple-touch-icon.png | 180×180 | iOS "Add to Home Screen" |
| android-chrome-192.png | 192×192 | Android home screen shortcut, PWA |
| android-chrome-512.png | 512×512 | PWA splash screen, Play Store |