All favicon sizes in 2026: Apple Touch Icon, Android, Windows

Modern devices and platforms require different icon sizes for browser tabs, the iOS home screen, Windows tiles, and PWA manifests. This article provides a complete list of sizes and markup for broad compatibility. Basic formats and markup are covered in the complete favicon guide. You can create all sizes from a single image with the Favicon Generator on reChecker.

Size overview

Browsers: tabs and bookmarks

Basic sizes

16×16  — стандарт для вкладки
32×32  — Retina, масштабирование
48×48  — закладки, панель избранного

Markup:

<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="/favicon-48x48.png">

Or use a single ICO with multiple sizes:

<link rel="icon" href="/favicon.ico" sizes="48x48">

Apple: Touch Icon

iOS and iPadOS use icons when a site is added to the home screen. If you don't specify apple-touch-icon, the system crops a screenshot of the page, with unpredictable results.

Apple Touch Icon sizes

The practical minimum is 180×180. The browser scales the image if needed.

Markup

<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="167x167" href="/apple-touch-icon-167.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120.png">

A single 180×180 file covers most use cases. Additional sizes provide optimal sharpness on all devices.

Apple requirements

• PNG, with or without transparency
• Square
• No rounded corners — iOS applies the mask automatically
• Don't add padding for rounded corners — the system will crop the edges

Android: Chrome and the home screen

When you select “Add to Home screen” in Chrome on Android, it uses icons from the manifest or meta tags.

Sizes

Markup

Using a manifest (preferred for PWA):

{
  "icons": [
    { "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" }
  ]
}

Using meta tags (if there is no manifest):

<link rel="icon" type="image/png" sizes="192x192" href="/icon-192.png">
<link rel="icon" type="image/png" sizes="512x512" href="/icon-512.png">

Windows: tiles and pinning

When a site is pinned in Windows 10/11, tiles of different sizes are used.

Windows Tile sizes

Markup

<meta name="msapplication-TileImage" content="/mstile-150x150.png">
<meta name="msapplication-TileColor" content="#2b5797">

Or use browserconfig.xml in the site root:

<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
  <msapplication>
    <tile>
      <square70x70logo src="/mstile-70x70.png"/>
      <square150x150logo src="/mstile-150x150.png"/>
      <wide310x150logo src="/mstile-310x150.png"/>
      <square310x310logo src="/mstile-310x310.png"/>
      <TileColor>#2b5797</TileColor>
    </tile>
  </msapplication>
</browserconfig>

TileColor is the tile background color on load or for simple icons.

Safari: Pinned Tab

Safari supports a monochrome icon for a pinned tab: an SVG with a single color.

<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">

The SVG must contain one color (usually black); the browser replaces it with color. Complex, multicolor icons are not suitable.

Minimum set (2026)

For most sites, the following is enough:

The extended set adds sizes for Windows, iPad Pro, and Safari Pinned Tab.

Generate the complete set

Creating a dozen sizes manually takes time. The Favicon Generator on reChecker creates a complete package from one source image (recommended: 512×512 or larger).

Steps:

1. Prepare a square image, 512×512 px
2. Upload it to the generator
3. Download the archive of files
4. Place the files in the site root
5. Add the markup from the generator's instructions

Compatibility checklist

• favicon.ico in the root
• 32×32 PNG for the tab
• Apple Touch Icon 180×180
• 192×192 and 512×512 icons for PWA/Android
• browserconfig.xml for Windows (optional)
• mask-icon for Safari Pinned Tab (optional)
• Versioned URLs when changing icons

Basic formats and markup are covered in the complete favicon guide. You can create all sizes with the Favicon Generator on reChecker.

Generate from the command line

Use ImageMagick to create a set from a single source image:

convert icon-512.png -resize 16x16 favicon-16x16.png
convert icon-512.png -resize 32x32 favicon-32x32.png
convert icon-512.png -resize 180x180 apple-touch-icon.png

For an ICO with multiple sizes:

convert icon-512.png -define icon:auto-resize=64,48,32,16 favicon.ico

Check how the icons display

After adding the files, check the favicon on different platforms:

• Chrome, Firefox, Safari, Edge — tab
• iOS — add to the home screen
• Android — add to the home screen
• Windows — pin to the taskbar

Update icons

When changing your branding, update all sizes and add URL versioning (?v=3). Let users know about the change — the old favicon may remain cached for a long time.

Summary

A complete set of sizes ensures correct display on all devices. Minimum: favicon.ico, 32×32 PNG, and 180×180 Apple Touch Icon. For PWA: 192×192 and 512×512. Generators automate creation from a single source image.