Favicon ジェネレーター

画像 1 枚から favicon.ico・apple-touch-icon・PWA アイコン一式を生成。

画像をここにドロップ
クリックでファイルを選択、またはクリップボードから貼り付け

サイトのアイコン一式を作るには複数のファイルが必要です：定番の favicon.ico、iOS ホーム画面用の 180×180 apple-touch-icon、Android や PWA マニフェストが求める 192 と 512 ピクセルのアイコン。エディターで手作業で作るのは手間がかかり、ミスもしやすいものです。

このジェネレーターは正方形画像 1 枚から一式をワンクリックで生成します —— ブラウザ内で直接構築される、正しい構造のマルチサイズ .ico ファイルも含みます。すべてのアイコンを宣言する HTML head スニペットも付いてくるので、サイトへの組み込みは数秒で完了します。

ベストな結果には、少なくとも 512×512 のシンプルでコントラストの高い正方形画像を使ってください。ロゴやレターマークが最適で、ディテールの多い写真は 16 ピクセルではつぶれます。

使い方

  1. 正方形の画像を 1 枚アップロードします（512×512 以上を推奨）。
  2. 各サイズのライブプレビューを確認します。
  3. favicon.ico を含む全ファイルを ZIP でダウンロードします。
  4. 提供された <head> スニペットをサイトに貼り、ファイルを所定の場所に置きます。

このツールのポイント

よくある質問

2026 年でも favicon.ico は必要？
最新ブラウザは HTML で宣言された PNG アイコンをそのまま使えますが、favicon.ico はブラウザやフィードリーダー、各種ツールが /favicon.ico をデフォルトで要求する際のフォールバックです。小さなものを 1 つ置いておけば、サーバーログの 404 連発を防げます。
正方形以外の画像はどうなりますか？
正方形のキャンバス中央に配置されます。余白を埋める背景色を選べるほか、透過を維持することもできます（透過対応形式を選んだ場合）。
ファイルはサイトのどこに置けばいい？
サイトのルート（または head スニペットで宣言したディレクトリ）に、提供された HTML タグと一緒に置きます。ブラウザがタブ・ブックマーク・ホーム画面に応じて自動的に最適なアイコンを選びます。
精細なロゴが 16px でぼやけるのはなぜ？
16 ピクセルには全部で 256 個ほどの点しかなく、ディテールは物理的に残りません。favicon 用には太い線・シンプルな形・高いコントラストの簡略版マークをデザインしてください。