Favicon ジェネレーター
画像・テキスト・絵文字からファビコンを簡単作成
入力ソース設定
画像をドラッグ&ドロップするか
100%
0%
0%
背景デザイン設定
ブラウザタブでの表示イメージ
書き出しサイズ一覧
16 x 16 (標準タブ)
32 x 32 (高DPIタブ)
48 x 48 (デスクトップ)
180 x 180 (Apple)
192 x 192 (Android)
512 x 512 (PWA大)
ダウンロード
個別ダウンロード:
HTML記述用コード
ダウンロードしたファイルをWebサイトのルートディレクトリに配置し、HTMLの <head> 内に以下のタグを追記してください。
推奨設定 (ICO + SVG + manifest)
<!-- ファビコンの設置コード -->
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest"> ファビコンのサイズとファイル形式について
favicon.ico (マルチサイズ)
1つのファイル内に 16x16、32x32、48x48 の複数の解像度を内包した形式です。クラシックなIE対策や、ブラウザのショートカット、お気に入りアイコンなどに依然として広く使われています。
apple-touch-icon.png
iPhoneやiPadなどのiOS端末で「ホーム画面に追加」した際に使われる 180x180 px のアイコンです。透過させず、背景色がしっかりと塗られた不透明なデザインにすることが推奨されます。
android-chrome / PWA
Android端末のChromeブラウザや、PWA(Progressive Web App)としてホーム画面に追加する際に使われる、192x192 px および 512x512 px の高解像度PNGアイコンです。
site.webmanifest
アプリ名やテーマカラー、Android/PWA用のアイコンパス(192px/512px)を指定するメタデータ用のJSONファイルです。スマホでアプリ同様に立ち上げるPWA機能には必須です。
✅ クリップボードにコピーしました