AZ Tools

Favicon ジェネレーター(マルチサイズ PNG)

ファイル

ロゴ/アイコンをドロップすると、ブラウザや OS が実際に要求する 10 サイズで PNG をレンダリング:16/32/48 はレガシー favicon、180 は Apple touch icon、192/512 は PWA manifest 用。背景色(または透過)とパディング % のオプション。貼り付けるだけの `<link>` スニペットを自動生成。すべて canvas でレンダリング — 画像はブラウザ外に出ません。

画像をドロップしてアイコンパック生成。

使い方

  1. 正方形の元画像をドロップ(PNG・SVG・JPG、できれば 512×512 以上)。
  2. 背景(透過か色)とパディング % を設定。
  3. 個別または一括でダウンロード後、HTML スニペットを `<head>` に貼付。

よくある質問

なぜサイズが多いの?
各環境がスケーリング無しで近いサイズを選ぶため。ブラウザは 32、Apple touch は 180、Chrome PWA は 192/512、Windows タイルは 144/270。全部用意するのが安全。
.ico は?
現代のブラウザは PNG を優先。`favicon.ico` が必要なら `favicon-32.png` をリネームすればほとんどのブラウザが受け付けます。
16×16 でドット潰れする。
小さいサイズではディテールが消えるので、簡略化したロゴを使用。32px 未満は別の「マーク」を用意するサイトが多い。
透過 vs 単色背景?
透過はダーク/ライトのブラウザや PWA インストール時に綺麗。単色(白やブランド色)は iOS ホーム画面でボタンらしく見える。

関連ツール