faviconを生成する方法
- JPEG、PNG、静止WebP画像を1件選びます。
- 中央の正方形に切り抜かれる範囲をプレビューで確認します。
- 「faviconを生成」を押し、用途ごとに必要なファイルを保存します。
生成するファイル
16、32、48 pxを格納したfavicon.ico、180 pxのapple-touch-icon.png、192 pxのicon-192.png、512 pxのicon-512.pngを生成します。PNGの透明度は保持します。
ICOはブラウザタブなどの小さい表示、180 pxはApple端末のホーム画面、192 pxと512 pxはWeb App Manifestの通常アイコンに使えます。設置場所やHTML・manifestの設定は、利用するサイトの構成に合わせてください。
正方形への切り抜き
元画像を引き伸ばさず、縦横の中央から短い辺と同じ大きさの正方形を切り抜きます。主な図柄が中央にない場合は、先に画像切り抜きツールで正方形へ調整してから生成してください。
小さな元画像から512 pxを生成する場合は拡大になるため、輪郭がぼやけることがあります。可能なら512 × 512 px以上の正方形画像を用意してください。
画像は送信されますか？
送信されません。画像の検査、復号、切り抜き、縮小、PNGとICOの組み立てはすべてブラウザ内で行います。選択した画像や生成結果をmonoLetが保存することもありません。
metadataと表示上の注意
生成画像には、入力画像のEXIF、位置情報、撮影日時、ICCプロファイルなどを引き継ぎません。また、端末やブラウザがアイコンへ背景色や角丸を加える場合があり、生成したPNGそのものと表示が完全には一致しないことがあります。
manifestとmaskableは生成しますか？
初版では生成しません。Manifestにはstart URLなどサイト固有の設定が必要です。maskableアイコンは重要な図柄を安全領域へ収める専用デザインが必要なため、単純な縮小結果をmaskableとは扱いません。