ファビコン作成（favicon.ico生成）
文字か画像を入れると、サイトに必要なファビコンをサイズ別に作ります。
入力した文章やファイルはサーバーに送らず、このブラウザー内だけで処理します。
ファイルをドロップするか、クリックして選んでください
apple-touch-icon（180px）はiOSが角を自動で丸めるため、背景を塗った四角形で作ります。
プレビュー
ファイル
HTMLタグ（<head>内に）
site.webmanifest
使い方
- 「文字・絵文字から」は1〜2文字や絵文字で、「画像から」はロゴ画像を読み込んで作ります。
- 背景色・形（四角・角丸・円）、文字の大きさや余白を決めると、プレビューがすぐに変わります。
- 「ZIPでまとめてダウンロード」を押すと、favicon.ico、PNG 6枚、site.webmanifest、タグのファイルを一度に保存できます。ファイルごとの保存もできます。
- ファイルをサイトのルートフォルダーに置き、「HTMLタグ」を<head>の中に貼り付けます。
よくある質問
favicon.icoにはどのサイズが入っていますか？
16・32・48pxの3枚がPNG形式で入っています。最新のブラウザーやWindowsは、ico内のPNGをそのまま読み込めます。
ファイル名を変えてもいいですか？
変えても構いませんが、HTMLタグとsite.webmanifest内のパスも合わせて直す必要があります。最初の名前のまま使うのがいちばん簡単です。
絵文字の見た目が端末によって違います。
絵文字はこの端末に入っているフォントで描くため、Windows・Mac・Androidで形が異なります。作ったPNGは画像なので、保存したあとはどこでも同じ見た目になります。
変更したファビコンがブラウザーに反映されません。
ブラウザーが古いファビコンを長くキャッシュしているためです。スーパーリロードをするか、タグのファイルパスの後ろに ?v=2 を付けてみてください。