ファビコン生成

画像を、あらゆるサイズのサイトアイコンに変えます。

正方形の画像をドロップ

またはクリック - できればPNG(512×512が理想)

ファビコンとは

ブラウザのタブ、ブックマーク、履歴、スマートフォンの検索結果、そしてホーム画面に追加したときに、Webサイトを表す小さなアイコンです。ファビコンがないとブラウザは汎用アイコンを表示するため、サイトが未完成に見えてしまいます。

ファビコンを作る

できれば正方形で、512×512ピクセル以上の画像を選んでください。Toolo が次のファイルを作成します。

ファイルサイズ役割
favicon.ico16、32、48pxタブとブックマーク(全ブラウザ)
apple-touch-icon180pxiPhone・iPad のホーム画面
アイコン192192pxAndroid のホーム画面、PWAマニフェスト
アイコン512512pxWebアプリの起動画面

ファイルの設置方法

favicon.ico をサイトのルートに置きます。ブラウザは自動的に /favicon.ico を探しに行きます。次に、各ページの <head> に対応するタグを追加します。たとえば:

インストール可能なWebアプリにする場合は、192と512のアイコンを manifest.webmanifest に記載します。

小さなアイコンで伝わるデザインにするコツ

新しいファビコンが表示されないとき

ブラウザはファビコンを長くキャッシュします。強制再読み込みする、シークレットウィンドウで開く、/favicon.ico?v=2 のようにバージョンを付けるなどを試してください。

よくある質問

画像は正方形でないといけませんか?

できれば正方形がおすすめです。正方形でない画像は合わせて変形されるため、少し歪むことがあります。先に「画像を切り抜く」で正方形にしてください。

画像はサーバーに送信されますか?

いいえ。アイコンはブラウザ内で作成され、画像が端末の外に出ることはありません。

透過PNGの透過は保たれますか?

はい。ICOファイルでもPNGでも透過は保たれます。

すべてのサイズが本当に必要ですか?

タブ用なら favicon.ico だけで十分です。180、192、512のPNGは、スマートフォンのホーム画面やWebアプリでの見た目を良くします。

関連ツール

姉妹サイト:NetCheck - ネットワーク・DNSツールVolt - 回線スピードテストBoxo - 使い捨てメールアドレス