ファビコン・アイコンを作る（favicon.ico と各サイズのPNGを一式）

使い方

1. 「文字から作る」か「画像から作る」を選びます。画像の場合は、使いたい部分が枠に収まるよう、ドラッグや拡大で調整します。
2. 形（四角・角丸・丸）、背景の色、余白を選びます。左のプレビューで、16px のような小さな大きさでの見え方も確かめられます。
3. 「アイコン一式を作る」を押すと、必要なファイルをまとめたZIPができます。1つずつ保存することもできます。
4. ZIPの中身をサイトのいちばん上のフォルダに置き、表示されたHTMLを各ページの <head> に貼り付けます。

作られるファイルと使われる場所

小さくても見分けやすいアイコンにするコツ

• 細かい模様や小さな文字は消える：ブラウザのタブでは 16px（文字1つ分くらい）で表示されます。ロゴ全体よりも、ロゴの一部や頭文字だけのほうが見分けやすくなります。
• 色の差をはっきりさせる：背景と中身の明るさに差がないと、小さくしたときに形が分からなくなります。
• 余白は少なめに：余白が多いと小さいときに中身が点になります。ただし丸い形では角が切れるので、少し余白をとってください。
• ダークモードも意識する：透明な背景に黒い図形だけのアイコンは、黒いタブでは見えなくなります。背景に色をつけておくと、どちらでも見えます。

よくある質問

アイコンを変えたのに、ブラウザの表示が変わりません

ファビコンはブラウザに長く保存（キャッシュ）されるため、すぐには変わらないことがあります。ページを再読み込みしても変わらない場合は、ブラウザの履歴（キャッシュ）を消すか、しばらく待ってください。検索結果のアイコンは、Google が次にサイトを確認したときに更新されます。

ブログサービスやホームページ作成サービスで使えますか？

多くのサービスでは、設定画面からファビコンの画像（PNG または ICO）をアップロードできます。そのときは、ZIPの中の favicon.ico か android-chrome-512x512.png を使ってください。

作ったアイコンの権利は？

自分で用意した画像や文字から作ったアイコンは、自由に使えます。他社のロゴやキャラクターを使う場合は、その権利者の許可が必要です。