Which sizes do you need?
| File | Size | Use |
|---|---|---|
| favicon.ico | 16, 32, 48 | Browser tab, older browsers |
| favicon-32x32.png | 32×32 | Modern browsers |
| apple-touch-icon.png | 180×180 | iOS home screen |
| android-chrome-192x192.png | 192×192 | Android, PWA |
| android-chrome-512x512.png | 512×512 | PWA splash |
Design tips
- Start from a square source of at least 512×512 pixels.
- Use simple shapes and high contrast so it reads at 16 pixels.
- If you use text, keep it to one or two letters.
Adding it to HTML
<link rel="icon" href="/en/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/en/favicon-32x32.png">
<link rel="apple-touch-icon" href="/en/apple-touch-icon.png">To get every file and this code in one step, use the favicon generator. For your favicon to appear in Google results, the file must be crawlable and the icon should be a multiple of 48 pixels (48, 96, 144…).