PNGをICO(ファビコン)に変換

ファビコンは、ブラウザがタブ、ブックマークバー、履歴に表示する小さなアイコンです。このツールはPNGを、16、32、48、64ピクセル版を含む本格的な複数サイズの.icoファイルにします。すべて端末上で作成され、アップロードはありません。

PNGをICOに変換する方法

  1. 下のツールにPNG画像をドロップします。正方形の画像が最適です。
  2. 出力フォーマットはすでにICO(ファビコン)に設定されています。
  3. 実行をクリックして複数サイズの.icoを生成します。
  4. favicon.icoをダウンロードし、サイトのルートに置きます。

ファビコンに求められること

ファビコンは非常に小さなサイズ、しばしば16ピクセル四方で表示されます。そのサイズでは細かいディテールは消え、細い線は完全に見えなくなります。良いファビコンは、強いコントラストを持つ大胆でシンプルな形です。1文字、簡略化したロゴマーク、ブランドカラーの塗りつぶし形状など。フルロゴにワードマークがあるなら、シンボルだけか最初の1文字だけを使ってください。

.icoファイルが複数のサイズを含む理由は、表示時に1つの画像を拡大縮小するとぼやけるからです。16、32、48、64ピクセル版を用意することで、OSやブラウザは各状況でピクセル単位で正確な画像を表示できます。タブでは16px、高DPI画面のブックマーク一覧では32px、Windowsのタスクバーショートカットでは48px、といった具合です。

元のPNGの準備

  • 正方形にしてください。ロゴが横長なら、先に正方形の透明キャンバスに置くか、切り抜きツールでシンボルに切り抜いてください。
  • 256ピクセル以上から始めてください。大きくきれいな元から縮小する方が、小さなものを拡大するより滑らかな結果になります。
  • 形が塗りつぶしなら透明な背景を保ち、明るいブラウザテーマでも暗いテーマでもうまく収まるように。形が細いか薄い色なら、代わりに塗りつぶしの角丸四角の上に置いてください。
  • 1〜2文字を超えるテキストは避けてください。16ピクセルでは読めません。

ファビコンの設置

ダウンロードしたファイルをfavicon.icoとして保存し、サイトのルートフォルダーに置きます。次にすべてのページの<head>内にこれを追加します:

<link rel="icon" href="/ja/favicon.ico" sizes="any">

ほとんどのプラットフォームには代わりに専用の設定があります。WordPressでは外観の下の「サイトアイコン」、ShopifyとSquarespaceにはテーマ設定にファビコン欄、Webflowにはプロジェクト設定にあります。そこに.icoをアップロードしてください。

さらに進める

最近の端末が求めるアイコン一式を揃えるには、iOSのホーム画面ショートカット用の180ピクセルのPNG(apple-touch-icon)と、Androidとウェブアプリマニフェスト用の192および512ピクセルのPNGも必要です。これらは普通のPNGファイルなので、同じマスターからリサイズツールで作ってください。このページの.icoはブラウザのタブ、ブックマーク、Windowsをカバーし、ほとんどの人がファビコンの欠如に気づくのはそこです。

よくある質問

元のPNGはどのサイズにすべきですか?

正方形で、最低64×64ピクセル。256ピクセルの正方形PNGが最もきれいな縮小結果になります。正方形でない画像は中央に配置され、透明で埋められます。

.icoファイルの中身は?

16、32、48、64ピクセルのPNGエンコード画像が4枚です。ブラウザとWindowsが状況に最も合うサイズを選ぶため、タブ、ブックマーク、デスクトップショートカットでアイコンがシャープに見えます。

ウェブサイトにファビコンを追加するには?

favicon.icoをサイトのルートにアップロードし(yoursite.com/favicon.icoでアクセスできるように)、ページの<head>内に<link rel="icon" href="/favicon.ico">を追加します。ブラウザはファビコンを強くキャッシュするため、変更を確認するにはハードリフレッシュが必要なことがあります。

2026年でもまだ.icoファイルは必要ですか?

最近のブラウザはPNGやSVGのファビコンも受け付けますが、.icoは古いブラウザ、Windowsのショートカット、一部のフィードリーダーを含め、どこでも動く唯一のフォーマットです。ほとんどのサイトは両方を用意しています。

ファイルは 端末から出ません

Squishly Toolsのすべてのツールは100%無料で、完全にブラウザ内で動作します。画像や書類はお使いのコンピューター上で処理され、サーバーにアップロードされることはありません。アカウントも透かしも、裏もありません。