ファビコンのサイズ一覧 2026年版｜全プラットフォーム完全対応ガイド
Favicon、Apple Touch Icon、Android Chrome、Microsoft Tile、OG画像など、全プラットフォームで必要なアイコンサイズを網羅的に解説。
faviconサイズガイド
アプリアイコン一括生成
1枚の画像からFavicon、Apple Touch Icon、Android、Microsoft Tile、OG画像を一括生成します。 ZIPファイルにはHTMLスニペットとマニフェストファイルも含まれます。
元画像をアップロード
512x512px以上の正方形画像を推奨します
ドラッグ&ドロップまたはクリックして画像を選択
PNG, JPG, GIF, BMP, WebP, SVG, AVIF (20MBまで)
プラットフォーム選択
生成するアイコンの対象プラットフォームを選択
生成されるファイル
選択したプラットフォームに応じたファイル一覧
Favicon
16x1632x3248x48
Apple Touch Icon
57x5760x6072x7276x76114x114120x120144x144152x152180x180
Android / Chrome
36x3648x4872x7296x96144x144192x192512x512
追加ファイル
favicon.ico (マルチサイズ)合計: 20ファイル + マニフェスト + HTMLスニペット
使い方
- 1元画像をアップロード（512x512px以上の正方形を推奨）
- 2対象プラットフォームを選択
- 3「ダウンロード」をクリックするとZIPファイルが生成されます
- 4ZIP内のHTMLスニペットを<head>タグに貼り付けてください
ZIPに含まれるマニフェストファイル
- site.webmanifest — PWA用マニフェスト（Android/Chrome選択時）
- browserconfig.xml — Windowsタイル設定（Microsoft選択時）
- html-snippet.txt — HTML <head> 用のタグ一覧
他の無料ツールも使ってみる
アプリアイコンの基礎知識
なぜ複数サイズが必要なのか
デバイスやプラットフォームごとに異なるサイズが求められます。 iOSのホーム画面、Androidのランチャー、Windowsのタイル、ブラウザのタブなど、 それぞれ最適なサイズで表示するために複数の画像が必要です。
Apple Touch Iconとは
iOSデバイスでWebサイトをホーム画面に追加した際に表示されるアイコンです。180x180pxが現在の標準サイズで、iOSが自動的に角丸やグロス効果を適用します。
PWAアイコン
PWAとしてインストールされる際のアイコンです。192x192と512x512の2サイズが必須で、 site.webmanifestファイルで定義します。512x512はスプラッシュ画面にも使用されます。
OG画像（Open Graph）
SNSでページがシェアされた際のサムネイル画像です。1200x630pxが推奨サイズで、 Facebook、Twitter、LinkedInなどで使用されます。 ファビコンとは別に横長の画像が必要です。
よくある質問（FAQ）
元画像はどのサイズが最適ですか？
512x512px以上の正方形画像を推奨します。最大サイズより大きい画像から縮小する方が、小さい画像を拡大するよりも高品質な結果が得られます。
正方形でない画像でも大丈夫ですか？
使用可能ですが、正方形にリサイズされるため上下または左右が切り取られる場合があります。あらかじめ正方形にトリミングしてからアップロードすることをおすすめします。
site.webmanifestとは何ですか？
PWA（Progressive Web App）の設定ファイルです。アプリ名、アイコンのパスとサイズ、テーマカラーなどを定義します。Androidでホーム画面に追加する際やPWAインストール時に参照されます。
すべてのプラットフォームを選択すべきですか？
最低限「Favicon」と「Apple Touch Icon」は選択を推奨します。PWA対応が必要なら「Android/Chrome」、Windowsのピン留め対応が必要なら「Microsoft Tile」も追加してください。
ZIPファイルの中身はどう使えばよいですか？
ZIPを展開し、すべてのファイルをWebサイトのルートディレクトリに配置してください。html-snippet.txtの内容をHTMLの<head>タグ内にコピー&ペーストすれば設定完了です。
関連する記事
Apple Touch Icon完全ガイド｜iPhone・Safariでのファビコン設定と表示の仕組み
Apple Touch Iconの設定方法を徹底解説。iPhoneホーム画面やSafariお気に入りでの表示、推奨サイズ180x180px、HTMLの書き方、Safariキャッシュ問題の対処法まで。
Apple Touch IconiOSiPhone
ファビコンの設定方法｜HTML・WordPress・各CMS別に完全解説【コピペOK】
ファビコン（favicon）をWebサイトに設定する方法をHTML直書き・WordPress・Shopify・Wixなど環境別に解説。コピペ可能なHTMLコード付き。
ファビコン設定方法HTML
Google検索結果にファビコンを表示させる方法｜要件・設定・確認手順まで
Google検索結果にファビコンを正しく表示させるための要件、推奨サイズ、設定方法、Search Consoleでの確認手順を解説。表示されない場合の原因と対処法も。
ファビコンGoogleSEO