WebPをICO（ファビコン）に変換
デザインツールから書き出したWebPのロゴを、そのまま本物のファビコンへ。16・32・48pxの3サイズが1ファイルに収まり、WebPのアルファ透過は角の丸みまでそのまま引き継がれます。48px以上の正方形ソースが最もきれいに仕上がります。
逆方向の変換： ICOをWebPに変換
使い方
ロゴのWebPファイル（正方形・48px以上推奨）をドラッグ＆ドロップします。
WebPのアルファがそのまま32ビットのエントリに写され、3つのサイズが1つの.icoにまとまります。
ダウンロードした.icoをfavicon.icoとして設置し、既存の<link rel="icon">指定と併用してください。
WebP vs ICO
WebPはウェブ配信では優等生ですが、/favicon.icoという住所だけは今もICOの縄張りです。ブラウザのタブ、ブックマーク、RSSリーダー、クローラー — 全員が確実に読めるのはICOだけ。ロゴのWebPは残しつつ、配信用にICOを添えるのが正解です。
| WebP | ICO | |
|---|---|---|
| 圧縮方式 | 非可逆・可逆の両対応 | 可逆（BMPまたはPNGを格納） |
| 透過 | あり（フルアルファ） | あり（フルアルファ） |
| アニメーション | あり | なし |
| 対応環境 | 現行の全ブラウザ（2020年以降） | ファビコン用途ではあらゆる環境 |
| 向いている用途 | ウェブ用の写真・サムネイル・UI素材 | ファビコン、Windowsアプリのアイコン |
よくある質問
いいえ。変換はWebAssemblyによってブラウザ内で完結するため、ファイルがお使いの端末の外に出ることは一切ありません。サーバーを介さない仕組みなので、ページを一度読み込めばオフラインでも動作し、ファイルサイズの制限も端末のメモリ以外にはありません。
完全に引き継がれます。各エントリはフルアルファの32ビットで書き出されるため、アンチエイリアスの効いた縁や淡い影までそのまま。ライト・ダークどちらのテーマでも白縁は出ません。
中央の正方形で切り抜かれます。ワードマーク（社名ロゴ）だと端が切れがちなので、シンボルマークだけを正方形で書き出してから変換するのがおすすめです。
モダンブラウザは対応していますが、/favicon.icoを直接取りに来るクローラーや古い環境は今も残っています。WebP指定と.ico設置の併用が、手間に対して最も確実な構成です。
48px以上の正方形なら十分で、256px程度が理想です。大きい分には縮小されるだけなので問題ありません。逆に32pxしかないソースは48pxエントリで拡大され、輪郭が甘くなります。
元のロゴにSVG版がある場合です。ベクターからなら各サイズが描き直されるため、WebP経由よりシャープに仕上がります。その場合はSVGをICOに変換をお使いください。
関連ツール
PNGをICO（ファビコン）に変換
PNGから16・32・48pxの3サイズ入りICOファビコンをブラウザ内で作成できます。透過はそのまま維持され、アップロードも登録も不要。正方形でない画像は中央で自動的に切り抜きます。
AVIFをICO（ファビコン）に変換
最新フォーマットのAVIFから、由緒あるICOファビコンを作成。透過を保ったまま16・32・48pxの3サイズを1ファイルに収めます。すべてブラウザ内で処理します。
WebPをPNGに変換
WebPをPNGへ無劣化で変換できる無料ツールです。処理はすべてブラウザ内で行われ、ファイルは送信されません。透過もそのまま引き継がれるため、PhotoshopなどWebP非対応のソフトでもすぐに開けます。
ICOをWebPに変換
ICOのアイコンを透過ごとWebPへ。同じ画像のPNGより軽く、ドキュメントサイトやブックマーク一覧での表示にも向きます。変換はブラウザ内で完結し、登録も不要です。