ファビコン生成 — 画像から一式そろったファビコンパッケージを作成
どんなロゴからでも、favicon.ico、全サイズの PNG、Apple タッチアイコン、webmanifest がそろったファビコン一式をワンクリックで作成できます。
ロゴをここにドロップ、またはクリックして選択
PNG、JPG、WebP — 正方形で 512×512 以上が最適です。すべてブラウザ内で生成され、ロゴがデバイスの外に出ることはありません。
不具合や改善できそうな点を見つけましたか？いただいたメッセージはすべて読み、すぐに対応します。
ロゴを 1 回読み込むだけで、27 ファイルのファビコン一式を 1 つの ZIP でダウンロードできます。本物の favicon.ico（16/32/48 を格納）、ファビコンの PNG、Apple タッチアイコンの全 9 サイズ（57〜180px）、manifest.json 付きの 6 種類の Android アイコン（36〜192px）、browserconfig.xml 付きの Microsoft タイルアイコン（70〜310px）に加え、サイトの head に貼り付ける HTML タグもそのまま用意されます。
このサイトのすべてのツールと同じく、処理はすべてブラウザ内で行われます。ロゴのリサイズ、ICO 形式へのパック、ZIP の作成もローカルで行われます。何もアップロードされないので、待ち時間も透かしもなく、プライバシーの心配もありません。
使い方
- ロゴをドロップします。512×512 以上の正方形の PNG を使うと最もシャープになります（正方形でない画像は中央で切り抜かれます）。
- ピクセルプレビューを確認します。ブラウザのタブで 16px と 32px で表示されるときの見た目そのものです。不鮮明なら、ロゴを簡略化してやり直してください。
- 一式を ZIP でダウンロードするか、個別のファイルを取得します。
- サイトのルートフォルダーに解凍し、用意された HTML タグを <head> に貼り付けます。
よくある質問
2026 年の Web サイトに必要なファビコンのサイズは？
最低限必要なのは、favicon.ico、16/32px の PNG、180×180 の Apple タッチアイコンです。あらゆるブラウザ、iOS の各世代、Android のランチャー、Windows のタイルとの完全な互換性を求めるなら、昔ながらの完全なセットは 16px から 310px まで27 ファイルに及びます。このジェネレーターがパッケージにするのはまさにそのセットで、それらを参照する manifest.json と browserconfig.xml も含まれます。
favicon.ico は本物の ICO ファイルですか？
はい。PNG でエンコードした 3 つのエントリ（16、32、48 ピクセル）を持つ本物の ICO コンテナで、最新のすべてのブラウザと Windows のバージョンが対応している形式です。PNG の名前を変えただけのものではありません。
ロゴはサーバーにアップロードされますか？
いいえ。リサイズ、ICO へのパック、ZIP の作成は、すべて canvas API を使ってブラウザ内で行われます。ロゴが端末の外に出ることはありません。未発表のブランドやクライアントの仕事では重要な点です。
16px だとファビコンがぼやけて見えるのはなぜですか？
16 ピクセルはとても小さく、細かいロゴはそのサイズでは潰れてしまいます。プレビューが不鮮明なら、簡略化したマークを使いましょう。アイコンのシンボルだけ、1 文字、太い図形などです。大手ブランドがロゴを簡略化したファビコンを用意しているのは、まさにこのためです。
ファビコンのファイルは Web サイトのどこに置けばよいですか？
サイトのルートに置き（/favicon.ico、/apple-touch-icon.png などでアクセスできるように）、用意された link タグを <head> 内に追加します。多くのプラットフォームでは public や static のフォルダーが該当します。WordPress では「外観」→「カスタマイズ」→「サイト基本情報」を使うか、テーマ経由でファイルを配置します。
パッケージの中身
• favicon.ico + favicon-16/32/96 の PNG — ブラウザのタブとブックマーク用。HTML タグがなくても、ブラウザは自動的に /favicon.ico を要求します。
• apple-icon-57x57 から 180x180 まで（9 サイズ）— iPhone と iPad の全世代のホーム画面アイコンと、古い iOS 向けの apple-icon-precomposed.png。
• android-icon-36x36 から 192x192 まで（6 種類の密度）— manifest.json から密度の指定付きで参照される Android のランチャーアイコン。
• ms-icon-70/144/150/310 + browserconfig.xml — Windows のスタートメニューのタイルと、それらを対応付ける設定ファイル。
• manifest.json — Android や PWA としてインストールする際に、サイト名、色、アイコンを伝えます。ダウンロード後に開いて、名前の項目を入力してください。
HTML スニペット内のパスが解決されるよう、すべてをサイトのルートディレクトリに展開し、スニペットを <head> に貼り付ければ完了です。
ひと目で見分けがつくファビコンのデザインのコツ
決める前に 16px でテストしましょう。上のプレビューが本当の姿を示しています。文字入りのロゴ全体より、太い図形や 1 文字を選びましょう。ワードマークは 48px 未満では読めなくなります。ブラウザのライトテーマとダークテーマのどちらに対してもコントラストを高く保ちましょう（細い線画のアイコンには、控えめな円や角丸の四角の背景が効果的です）。そして同じファビコンを何年も使い続けましょう。再訪問者は 20 個のタブの中からそれを目印にあなたのタブを見つけます。