Marketplace Image ResizerMARKETPLACE IMAGE RESIZER

Complete Favicon Size Guide

Every favicon size you need for perfect display across all browsers, devices, and platforms. Updated for 2024.

Generate All Sizes Automatically →

Quick Reference Table

Here's a complete table of all favicon sizes used in modern web development:

SizePlatformPurposeRequired?
16x16
Browser tabs
Small browser tab icon
Essential
32x32
Browser tabs
Standard browser tab icon
Essential
48x48
Windows
Windows site icons
Recommended
180x180
iOS
Apple Touch Icon
Essential
192x192
Android
Android home screen
Essential
512x512
PWA
PWA splash screens
Essential
150x150
Windows
Windows tile (medium)
Recommended
310x310
Windows
Windows tile (large)
Recommended

Detailed Size Breakdown by Platform

Web Browsers (Required)

16x16

Small Tab Icon

Format: PNG, ICO
Use: Browser tab (zoomed out)
File: favicon-16x16.png
Design must be extremely simple
32x32

Standard Tab Icon

Format: PNG, ICO
Use: Browser tab, bookmarks
File: favicon-32x32.png
Most common favicon size
48x48

Windows Icon

Format: ICO
Use: Windows site icons
File: favicon.ico
Legacy support

iOS / Apple Devices

180x180

Apple Touch Icon

Format: PNG
Use: iPhone/iPad home screen
File: apple-touch-icon.png
Apple adds rounded corners
Optional

Other iOS Sizes

152x152: iPad non-Retina
167x167: iPad Pro
120x120: iPhone 2x
iOS falls back to 180x180

Android / Chrome

192x192

Home Screen Icon

Format: PNG
Use: Home screen, Chrome new tab
File: android-chrome-192x192.png
Referenced in manifest.json
512x512

Splash Screen

Format: PNG
Use: Splash screen, high-DPI
File: android-chrome-512x512.png
Also used for PWA

Progressive Web Apps (PWA)

File Format Recommendations

PNG Format

Best for: All modern browsers and mobile devices

  • ✅ Transparency support
  • ✅ High quality
  • ✅ Universal support
  • ✅ Easy to create

ICO Format

Best for: Legacy browser support

  • ✅ IE compatibility
  • ✅ Multi-resolution
  • ✅ Single file
  • ⚠️ Complex to create

SVG Format

Best for: Modern browsers only

  • ✅ Scalable
  • ✅ Tiny file size
  • ⚠️ Limited support
  • ⚠️ No mobile support

How to Choose Which Sizes You Need

Minimum Required Set (6 files)

For basic website coverage:

  • favicon.ico (16x16, 32x32, 48x48 combined)
  • favicon-16x16.png
  • favicon-32x32.png
  • apple-touch-icon.png (180x180)
  • android-chrome-192x192.png
  • android-chrome-512x512.png

Complete Set (17 files)

For comprehensive coverage including PWA:

  • All minimum files above
  • Additional iOS sizes (152x152, 167x167, 120x120)
  • Windows tiles (150x150, 310x310)
  • PWA maskable icons (192x192, 512x512)
  • Safari pinned tab (SVG or PNG)

Performance Considerations

File Size Targets

File size matters for performance. Aim for these targets:

16x16 & 32x32
Browser tabs
Under 1KB each
180x180
iOS home screen
Under 10KB
192x192
Android home screen
Under 15KB
512x512
PWA splash screens
Under 50KB
ICO file
Legacy browsers
Under 15KB total

Optimization Tips

Use PNG-8 instead of PNG-24 when possible (256 colors often sufficient)
Run images through compression tools (TinyPNG, ImageOptim)
Remove unnecessary metadata and color profiles
Optimize transparency - use 1-bit alpha if possible

Quick Implementation Guide

Minimum Required Files

For basic favicon support across all platforms:

favicon.ico
Legacy browser support (16x16, 32x32, 48x48)
apple-touch-icon.png (180x180)
iOS home screen icon
android-chrome-192x192.png
Android home screen icon
android-chrome-512x512.png
PWA splash screen icon

Generate All Sizes Automatically

Our favicon generator creates all these sizes for you in one click. No need to manually resize or convert formats - we handle everything automatically.

Create Your Favicons Now →

Related Guides

How to Create a Favicon

Step-by-step guide to creating all these sizes.

Favicon Best Practices

Optimization tips for all favicon sizes.

PWA Icon Guide

Special requirements for Progressive Web Apps.