使い方
- 1ドロップゾーンに画像をドラッグ＆ドロップするか、クリックしてファイルを選びます。正方形・512×512px以上の画像を推奨します。
- 2画像を読み込むと、各サイズのファビコンが自動で生成され、市松模様の背景でプレビュー表示されます。
- 3必要なサイズだけ欲しい場合は各アイコンの「ダウンロード」を、すべて必要な場合は「すべてダウンロード」をクリックして保存します。
- 4表示された「HTMLスニペット」を自分のサイトの <head> 内にコピーし、ファイルを設置すればファビコンが反映されます。
よくある質問
- どんな画像を用意すればよいですか？
- 正方形で、できれば512×512px以上の大きめの画像をおすすめします。小さい画像を引き伸ばすとぼやけるため、元の解像度が高いほどきれいに仕上がります。背景を透過したい場合は、あらかじめ透過PNGを用意すると効果的です。
- なぜ複数のサイズが必要なのですか？
- ブラウザタブ、ブックマーク、スマホのホーム画面、PWAなど、表示される場所ごとに最適なサイズが異なるためです。複数サイズを用意しておくと、どの環境でも鮮明にアイコンが表示されます。
- 生成したファビコンの設置方法は？
- 出力されるHTMLスニペットをサイトの <head> 内に貼り付け、ダウンロードしたPNGファイルをサイトのルートなど参照先のパスに設置します。Apple Touch IconやmanifestもまとめてリンクしておくとPWAにも対応できます。
- 画像はサーバーにアップロードされますか？
- いいえ。リサイズと生成の処理はすべてお使いのブラウザ内で完結し、画像が外部サーバーに送信・保存されることはありません。公開前のロゴも安心して扱えます。