PNGからICOへの変換ツール

PNGからICOへの変換ツールは、PNG画像を正方形に縮小したコピーを、指定したサイズごとに1つずつ作り、1つの.icoファイルにまとめます。ここは多くの人が最初につまずく点です。.icoは拡張子が変わっただけの1枚の画像ではなく、先頭にディレクトリを持つ小さなコンテナです。ディレクトリには、中に入っているすべての画像と、それぞれの開始位置が記録されています。ブラウザがタブを描画するときも、デスクトップがショートカットを描画するときも、ファイルを読み込むものはこのディレクトリを見て、必要なサイズに最も近いエントリを選びます。

このページでは4つのサイズを書き出します。開いた時点ですべてチェック済みで、16、32、48、256ピクセルです。チェックを入れた各サイズが、.ico内の1つの正方形の画像になります。画像はアルファチャンネルを保ったままPNG圧縮で保存され、小さいサイズから順に書き込まれます。不要なサイズのチェックを外すと、ファイルは小さくなります。4つすべてのチェックを外した場合は、中身が空のアイコンでは役に立たないため、4つすべてを書き出します。256が上限なのはツールの都合ではなく形式の仕様です。ICOのディレクトリエントリは幅を1バイトで記録するため、.icoに入れられる最大の画像は256で、その値は特別な値の0として保存されます。

チェックを入れる最大サイズ以上の大きさがある、正方形のPNGから始めてください。ツールは画像を各正方形に縮小しますが、縮小はきれいに見える方向の処理です。たとえば64 pxの元画像で256にチェックを入れると、256のエントリは64 pxの画像を4倍に引き伸ばしたものになり、高DPI画面で最も目立つサイズでぼやけてざらついて見えます。デザインツールから書き出した512x512の画像なら、どのサイズにも余裕を持って対応できます。

正方形ではないロゴも、よくある問題です。ツールは、はみ出させたり切り抜きを推測したりせず、画像を各正方形に合わせて引き伸ばし、そのことを表示で知らせます。たとえば1024x256のワードマークを読み込むと、行には「画像は1024x256だったため、16、32、48、256 pxの正方形に引き伸ばされました。」と表示されます。引き伸ばしたワードマークは、16 pxではどのみち読めません。対処法は、変換した後ではなく変換する前に、小さいサイズで何を見せるかを決めることです。たいていは、シンボルだけを切り抜くか、透明な余白を付けた正方形のキャンバスにワードマークを配置して、縦横比を保ったままアイコン内に小さく収めます。

ここで一通りの流れを見てみましょう。logo.pngという512x512のファイルを用意し、4つのチェックボックスをすべて入れたままドロップします。すぐに変換が始まり、行には入力サイズ、矢印、出力サイズ、サイズの増減が表示されます。その下には「16、32、48、256 pxのアイコンを含みます。」という注記が出て、行のダウンロードアイコンでlogo.icoを保存できます。256のチェックを外すと、ファイルは自動的に再変換されます。同じ元画像から3つの画像を含むずっと軽いファイルができます。256 pxのエントリが容量の大半を占めていたためです。ブランドのPNGを8枚まとめてドロップした場合は、「すべてダウンロード (8枚)」でconverted-ico.zipが保存され、すべての.icoが入ります。同じ名前のファイルは上書きされず、番号が付けられます。

処理はすべてブラウザ内で行われます。ブラウザがPNGをデコードし、キャンバス上で指定された各サイズに描画し、各正方形をPNGとしてエンコードして、メモリ上で.icoを組み立てます。そのため、画像データがデバイスの外に出ることはなく、ページを一度読み込めば、ネットワークを切断しても動作します。透明部分はどのサイズでも保たれ、背景色で塗りつぶされることはありません。元画像に付いているメタデータやカラープロファイルは、キャンバスでの処理中に取り除かれます。100メガピクセルを超える画像はメッセージを表示して拒否され、空のファイルも拒否されます。ファイルサイズ(バイト数)の上限はありません。ツールは無料で登録不要ですが、変換回数には1日あたりの上限があります。

• サイズ変更とパッキングは、ブラウザの Canvas API を使ってクライアント側で行われます。PNG も完成した .ico も、このタブの外には出ません。
• 未公開のロゴやブランドマークも、サードパーティのサービスに渡すことなく変換できます。
• 1 日の利用回数チェックでは、ファイル数、合計サイズ（バイト単位）、変換先の形式が送信されます。ファイル名や画像のピクセルデータは含まれません。
• PNG 内のメタデータとカラープロファイルは、アイコンのエントリにはコピーされません。
• 完成したアイコンは、削除する、「すべてクリア」を押す、またはタブを閉じるまでメモリに保持され、サーバーにコピーは保存されません。