「正しい」ファビコンサイズは1つではありません。モダンなウェブサイトは、 ブラウザタブ、モバイルのホーム画面、PWA、検索結果全体で正しく見えるために複数の寸法を必要とします。これが完全なリファレンスです。 ブックマークしておきましょう。
必須のファビコンサイズ（クイックリファレンス）
| サイズ | ファイル | 使用場所 | 必須？ |
|---|---|---|---|
| 16×16 | favicon-16x16.png | ブラウザタブ（古典的） | はい |
| 32×32 | favicon-32x32.png | ブラウザタブ（Retina）、タスクバー | はい |
| 48×48 | favicon.ico 内 | Windowsのサイトアイコン、古いブラウザ | 推奨 |
| 180×180 | apple-touch-icon.png | iOSホーム画面、Safariピン留めタブ | はい |
| 192×192 | android-chrome-192x192.png | Androidホーム画面、Chrome PWA | はい（PWA） |
| 512×512 | android-chrome-512x512.png | PWAスプラッシュスクリーン、高解像度Android | はい（PWA） |
| ベクター | favicon.svg | モダンブラウザ、ダークモード、Safariピン留め | 推奨 |
推奨されるソース画像サイズ
常に 最低512×512ピクセルの正方形画像（理想は1024×1024）から 始めてください。優れたジェネレーターは、これを上記のすべてのサイズに、 それぞれシャープさを保ちながら縮小します。小さい画像を拡大してはいけません。 512×512のPWAスプラッシュのような大きいサイズでぼやけます。
各サイズが存在する理由
16×16と32×32 — ブラウザタブ
これらはユーザーが最も目にするサイズです。16×16はレガシーなデフォルトで、 32×32は高DPI（Retina）ディスプレイでシャープに見えます。必ず両方を含めましょう。
180×180 — Apple touch icon
iPhoneやiPadのユーザーが「ホーム画面に追加」をタップすると、iOSはこのファイルを 使います。SafariはMacでのピン留めタブにも使います。ちょうど180×180で なければなりません。
192×192と512×512 — AndroidとPWA
Android ChromeなどのPWA対応ブラウザは、site.webmanifest から これらを読み取ります。192はホーム画面アイコン、512はPWA起動時の フルスクリーンスプラッシュを支えます。
Google検索結果のファビコンは？
Googleはモバイル（そしてますますデスクトップ）の検索結果の横に小さい ファビコンを表示します。これは宣言されたファビコン（通常32×32または.ico）から取得されます。Googleは最低48×48の正方形画像を推奨しています （48の倍数が理想）。<link rel="icon"> が有効であることを 確認してください。無効な場合、Googleは汎用的な地球のアイコンを表示します。
.icoファイル：1つのファイルに多数のサイズ
.ico フォーマットは特殊で、1つのファイルに複数のサイズ （一般的には16×16、32×32、48×48）をまとめられます。だからこそ良いfavicon.ico は最も互換性の高い選択肢です。すべてのブラウザが 埋め込まれたサイズから最適なものを自動的に選びます。
これらのサイズを手作業で管理したくない？
その必要はありません。Favicon.one に 正方形の画像を1枚アップロードすれば、上記の全サイズ、.ico、 Apple touch icon、SVG、site.webmanifest、さらにコピペ済みHTMLを 含むZIPをダウンロードできます。