OpenReplay Logo
12k
12k

ファビコンジェネレーター

任意の画像を完全な favicon セット — favicon.ico、各 PNG サイズ、HTML スニペット — に変換します。ブラウザ内でローカルにレンダリングされ、何もアップロードされません。

ブラウザー内でローカルにレンダリングされます — 画像がアップロードされることはありません。

このツールについて

favicon は、ブラウザがタブ、ブックマーク、履歴に表示する小さなアイコンです。現代のサイトは、16×16 のタブから 512×512 の PWA インストール画面まで鮮明さを保てるよう、複数のサイズのセットを用意します。このジェネレーターは 1 枚のソース画像(PNG、JPG、SVG、WebP)を受け取り、正方形に中央クロップして標準サイズをレンダリングします。favicon.ico 用に 16、32、48、Apple タッチアイコン用に 180、Android/マニフェストアイコン用に 192 と 512 です。すべてはブラウザ内の <canvas> 上で実行され、.ico は小さな PNG を Windows の ICONDIR コンテナに直接埋め込んで組み立てられます。これは現在のすべてのブラウザと OS が読み取れます。

新しいプロジェクトの favicon セットを立ち上げたり、リブランド後にアイコンを刷新したり、Lighthouse や PWA の監査が求める正確なファイルを生成したりするのに使えます。正方形のロゴをドロップし、お好みで角丸や透明なパディングを切り替え、その後 favicon.ico と各 PNG をダウンロードし、用意済みの <link> タグと site.webmanifest のアイコンブロックを <head> に貼り付けてください。

.ico ファイルには実際の PNG(PNG-in-ICO)が埋め込まれており、現代のすべてのブラウザがこれを読み取ります。サイトのルートに /favicon.ico として配置してください。

よくある質問

favicon にはどのサイズの画像をアップロードすべきですか?

最大の出力が鮮明さを保てるよう、少なくとも 512×512 px の正方形画像をアップロードしてください。それより小さいソースは拡大され、ぼやけて見えることがあり、正方形でない画像はレンダリング前に正方形に中央クロップされます。

favicon.ico ファイルはまだ必要ですか?

はい。サイトのルートにある favicon.ico は、ブラウザやクローラーが自動的に要求するフォールバックであり、一部の古い環境ではこれしか探さないものもあります。このツールは 16、32、48 px のフレームを埋め込んだものを、<link> タグで参照される現代的な PNG アイコンと併せて作成します。

favicon ジェネレーターが複数の PNG サイズを生成するのはなぜですか?

表示される場所ごとに異なるサイズが要求されるためです。ブラウザのタブには 16/32 px、iOS のホーム画面の Apple タッチアイコンには 180 px、Android と PWA のマニフェストアイコンには 192/512 px です。これらすべてを用意しておくことで、各プラットフォームは 1 枚の画像を拡大縮小する代わりに最も近いものを選べます。