ウェブサイトに最適なファビコン サイズ

オンラインには数十の推奨事項があります。実際に 100% のユーザーをカバーする最小限のセットを次に示します。

5 分で読了

Check favicons on any website

Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.

Install Chrome Extension

ブラウザが要求するもの

デスクトップ ブラウザは、16×16 (タブ)、32×32 (ブックマーク バー)、および 48×48 (検索結果) を要求します。 3 人全員が 1 つの .ico ファイル内で幸せに暮らしています。

オペレーティング システムが要求するもの

Windows スタート メニューとファイル エクスプローラーは最大 256×256 を要求できます。 macOS は .icns を好みますが、.ico も受け入れます。すべてをカバーするには、16、32、48、64、128、256 を .ico にバンドルします。

PWA とモバイル リクエスト

ホーム画面にクリーン インストールするために、180×180 (apple-touch-icon) および 192×192 + 512×512 PNG (Web マニフェスト) を追加します。

実行可能な最小限のセット

マニフェスト内のマルチサイズ favicon.ico + apple-touch-icon.png (180×180) + 512×512 PNG。それでおしまい。

よくある質問

What is the best favicon size for websites?

Ship a multi-size favicon.ico with 16, 32, 48, 64, 128, and 256 pixels. Add 180×180 for Apple and 192/512 PNGs for PWAs.

What favicon size do browsers use in tabs?

Desktop browsers typically request 16×16 for tabs, 32×32 for bookmark bars, and 48×48 for some search results.

What is the minimum favicon setup?

A multi-size favicon.ico plus apple-touch-icon.png (180×180) and a 512×512 PNG in your web manifest.

Do I need a 256×256 favicon?

Yes for Windows shortcuts and high-DPI surfaces. Bundle it inside your .ico file.

関連ガイド

ツールを試す

続きを読む