アプリアイコン一括生成
1枚の画像からFavicon、Apple Touch Icon、Android、Microsoft Tile、OG画像を一括生成します。 ZIPファイルにはHTMLスニペットとマニフェストファイルも含まれます。
ドラッグ&ドロップまたはクリックして画像を選択
PNG, JPG, GIF, BMP, WebP, SVG, AVIF (20MBまで)
Favicon
Apple Touch Icon
Android / Chrome
追加ファイル
favicon.ico (マルチサイズ)合計: 20ファイル + マニフェスト + HTMLスニペット
使い方
- 1元画像をアップロード(512x512px以上の正方形を推奨)
- 2対象プラットフォームを選択
- 3「ダウンロード」をクリックするとZIPファイルが生成されます
- 4ZIP内のHTMLスニペットを<head>タグに貼り付けてください
ZIPに含まれるマニフェストファイル
- site.webmanifest — PWA用マニフェスト(Android/Chrome選択時)
- browserconfig.xml — Windowsタイル設定(Microsoft選択時)
- html-snippet.txt — HTML <head> 用のタグ一覧
アプリアイコンの基礎知識
なぜ複数サイズが必要なのか
デバイスやプラットフォームごとに異なるサイズが求められます。 iOSのホーム画面、Androidのランチャー、Windowsのタイル、ブラウザのタブなど、 それぞれ最適なサイズで表示するために複数の画像が必要です。
Apple Touch Iconとは
iOSデバイスでWebサイトをホーム画面に追加した際に表示されるアイコンです。180x180pxが現在の標準サイズで、iOSが自動的に角丸やグロス効果を適用します。
PWAアイコン
PWAとしてインストールされる際のアイコンです。192x192と512x512の2サイズが必須で、 site.webmanifestファイルで定義します。512x512はスプラッシュ画面にも使用されます。
OG画像(Open Graph)
SNSでページがシェアされた際のサムネイル画像です。1200x630pxが推奨サイズで、 Facebook、Twitter、LinkedInなどで使用されます。 ファビコンとは別に横長の画像が必要です。
よくある質問(FAQ)
元画像はどのサイズが最適ですか?
512x512px以上の正方形画像を推奨します。最大サイズより大きい画像から縮小する方が、小さい画像を拡大するよりも高品質な結果が得られます。
正方形でない画像でも大丈夫ですか?
使用可能ですが、正方形にリサイズされるため上下または左右が切り取られる場合があります。あらかじめ正方形にトリミングしてからアップロードすることをおすすめします。
site.webmanifestとは何ですか?
PWA(Progressive Web App)の設定ファイルです。アプリ名、アイコンのパスとサイズ、テーマカラーなどを定義します。Androidでホーム画面に追加する際やPWAインストール時に参照されます。
すべてのプラットフォームを選択すべきですか?
最低限「Favicon」と「Apple Touch Icon」は選択を推奨します。PWA対応が必要なら「Android/Chrome」、Windowsのピン留め対応が必要なら「Microsoft Tile」も追加してください。
ZIPファイルの中身はどう使えばよいですか?
ZIPを展開し、すべてのファイルをWebサイトのルートディレクトリに配置してください。html-snippet.txtの内容をHTMLの<head>タグ内にコピー&ペーストすれば設定完了です。