ICO形式は、ウェブの初期から標準的なfavicon形式として使われてきました。現代のブラウザはPNG形式のfaviconもサポートしていますが、最大限の互換性を確保するためには、ICO形式が依然として不可欠です。ここでは、PNGをICOに変換する様々な方法をご紹介します。

2026年になってもICOが重要な理由

方法1：オンラインツール（最も簡単）

最も簡単な方法は、Mzu favicondlのImage to Faviconツールを使うことです。

  1. Toolsページにアクセスします。
  2. PNG画像をアップロードします。
  3. ツールがすべてのfaviconサイズ（ICO、16×16、32×32、180×180、192×192、512×512）を生成します。
  4. 完全なパッケージをZIPファイルとしてダウンロードします。

特典： ZIPファイルには、HTMLコードスニペットとsite.webmanifestファイルも含まれています。これらは、サイトにfaviconを追加するために必要なすべてです。

方法2：ImageMagickを使ったコマンドライン

ターミナルを好む開発者にとって、ImageMagickは標準的なツールです。

# Install ImageMagick
# macOS: brew install imagemagick
# Ubuntu: sudo apt install imagemagick
# Windows: choco install imagemagick

# Convert PNG to ICO (single size)
magick convert input.png -resize 32x32 favicon.ico

# Create multi-size ICO (recommended)
magick convert input.png -define icon:auto-resize=16,32,48 favicon.ico

マルチサイズのアプローチが最適です。ブラウザが自動的に最も適切なサイズを選択します。

方法3：FFmpegを使う

FFmpegがすでにインストールされている場合：

ffmpeg -i input.png -vf scale=32:32 favicon.ico

方法4：Pythonスクリプト

Pillowライブラリを使用します：

from PIL import Image

img = Image.open('input.png')
img.save('favicon.ico', format='ICO',
         sizes=[(16, 16), (32, 32), (48, 48)])

PNG vs ICO：それぞれの使い分け

機能PNGICO
モダンブラウザのサポートすべてすべて
レガシーブラウザのサポートIE 11+すべてのIEバージョン
1ファイル内の複数サイズなしあり
透明度ありあり
ファイルサイズサイズごとに小さい大きい（マルチサイズ）
Windowsショートカットなしあり
ブラウザによる自動検出HTMLで宣言した場合のみ/favicon.icoが自動検出される

ベストプラクティス：両方を使用する

推奨されるアプローチは、両方の形式を提供することです。

<!-- ICO as fallback -->
<link rel="icon" type="image/x-icon" href="/favicon.ico">

<!-- PNG for modern browsers (crisper rendering) -->
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">

モダンブラウザはPNGを優先します。古いブラウザやWindowsのショートカットはICOを使用します。これにより、両方の利点を享受できます。

最適な結果を得るためのヒント