ICO変換（複数サイズのファビコン）

Q: サイトに追加するにはどうすればよいですか？

favicon.icoをサイトのルートにアップロードし、ページのheadに ` ` を追加します。

PNG、JPG、SVGからブラウザ内で、本物の複数サイズの.icoファビコンを作成。16〜256pxのアイコンがPNGとして1つのファイルに格納されます。

ここに画像をドロップするか、クリックして選択

クリップボードから画像を貼り付けることもできます（Ctrl+V / ⌘V）

すべてブラウザ内で実行されます。データがアップロードされることはありません。

ICO変換とは？

ICO変換は、画像の複数のサイズ（既定では16、32、48、64、128、256px）を含むWindowsアイコン（.ico）ファイルを作成します。ブラウザやWindowsは各場所に最適なサイズを選ぶため、タブ、ブックマーク、タスクバー、デスクトップでアイコンが鮮明に保たれます。正方形でない画像は、余白を足すか切り抜いて正方形にできます。

ICO変換の使い方

正方形の画像（できれば256×256px以上。透過PNGやSVGが最適）をドロップ、選択、または貼り付けます。
含めるサイズにチェックを入れます。
画像が正方形でない場合は、正方形の内側に収めるか、中央の正方形を切り抜くかと、余白を透明にするかどうかを選びます。
サイズのプレビューを確認し、favicon.ico をダウンロードして、HTMLスニペットをページの <head> に追加します。

例

入力

40×20 PNG with the default sizes

出力

ICO file starting with bytes 00 00 01 00, containing six PNG entries: 16, 32, 48, 64, 128 and 256 px (a warning notes that sizes above 40 px are upscaled)

ICO変換を使うべき場面

Webサイト用の favicon.ico や、Windowsアプリケーションやショートカット用のアイコンを作成するときに使います。最近のサイトでは、PNGの apple-touch-icon と、できればSVGのファビコンも用意してください。PNGエントリを読めないWindows XPとの互換性が必要な場合は、BMPエントリを書き出すデスクトップのアイコンエディタを使ってください。

ICO変換の仕組み

選択した各サイズは、段階的な高品質の縮小でレンダリングされ、32ビットのPNGとしてエンコードされます。その後、ツール自身がICOコンテナを書き出します。6バイトのICONDIRヘッダー、サイズごとに16バイトのディレクトリエントリ（幅と高さのバイト（0は256を意味する）、ピクセルあたり32ビット、データ長とオフセット）、続いてPNGデータです。PNG圧縮のICOエントリはWindows Vista以降の形式の一部で、現在のすべてのブラウザが対応しています。