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

正方形の画像をアップロードして、必要なすべてのファビコンサイズをダウンロードできます。すぐに貼り付けられるHTMLリンクタグ付き。

正方形の画像（PNG、JPG）をドロップ、またはクリックして選択

またはテキストから生成：

背景

文字

機能

標準サイズをすべて生成

link タグのコードを生成

manifest.json のスニペット

zip でまとめてダウンロード

使い方

1. アップロードエリアに正方形の画像（PNG/JPG）をドロップします。

2. 生成されたすべてのサイズをプレビューします。

3. 「ダウンロード」をクリックしてZIPファイルとして取得し、HTMLスニペットをコピーします。

このツールについて

ファビコンはブラウザーのタブ、ブックマーク、履歴、ホーム画面のショートカット、検索結果に表示され、場所ごとに必要なサイズが違います。このジェネレーターは正方形の画像1枚、または色付き背景の上の1～2文字をもとに、16、32、48、64、128、180、192、256、512 ピクセルのサイズを描き、それぞれの PNG にダウンロードボタンを用意します。ファビコンが失敗しやすいのは小さいサイズで、16 × 16 では細かな描写や細い文字が消えてしまうため、太い形と強いコントラストが効果的です。大きいサイズもくっきり保つには、512 × 512 ピクセル以上の正方形の元画像を使ってください。ダウンロード後はページの head で link タグから参照し、インストール可能なウェブアプリでは manifest に 192 と 512 のサイズを記載します。

よくある質問

実際に必要なファビコンのサイズは？

多くのサイトでは、ブラウザーのタブ用に 32 × 32（旧環境向けに 16 × 16）、Apple タッチアイコン用に 180 × 180、Android とウェブアプリの manifest 用に 192 × 192 と 512 × 512 です。Google 検索は 48 ピクセルの倍数のサイズからファビコンを表示するので、48 × 48 もあると安心です。

ページにはどんな HTML を追加すればよいですか？

典型的には <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">、<link rel="apple-touch-icon" href="/favicon-180x180.png">、そして 192 と 512 のアイコンを記載した manifest です。すべてのページの <head> に入れてください。

.ico ファイルは作れますか？

作れません。書き出すのは PNG ファイルで、現在のブラウザーはすべて rel="icon" に PNG を使えます。非常に古いブラウザーや一部の Windows 機能のために複数サイズの favicon.ico が必要な場合は、専用の ICO ツールで 16、32、48 の PNG をまとめてください。

16 ピクセルでファビコンがぼやけたり読めなかったりするのはなぜですか？

512 ピクセルで見える細部は 16 ピクセルでは失われます。簡略化したマーク、太い線、強いコントラストを使うか、太字の1文字を使うテキストオプションなら小さなサイズでも読みやすくなります。

新しいファビコンが表示されないのはなぜですか？

ブラウザーはファビコンを強くキャッシュします。キャッシュを消すかプライベートウィンドウでサイトを開き、差し替えるときはファイル名を変えるか ?v=2 のようなバージョン指定を付けてください。検索エンジンへの反映には数日から数週間かかることがあります。

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

生成したファビコン

機能

使い方

このツールについて

よくある質問

関連ツール