画像ツール / 21
Favicon Converter
1枚の画像から、すべてのPNGサイズ、複数解像度のfavicon.ico、site.webmanifestをまとめた完全なfaviconパッケージを1つのzipにします。
Favicon Converter: TOEAは画像を16, 32, 180, 192, 512ピクセルでレンダリングし、小さい2サイズを複数解像度のfavicon.icoに格納し、対応するsite.webmanifestを書き、全7ファイルをzipにまとめます。 サーバーへのファイルアップロードは一切なく、100%ブラウザ内でローカル実行します。
- カテゴリ
- 画像ツール
- 実行回数
- ブラウザ内で
- コスト
- 無料 · 登録不要
- 提供状況
- すぐに使えます
完全にブラウザ内で実行します
PNG、JPG、WebP、またはSVG · 1024 × 1024以上が最適です
ICOファイルをルートに置く
ブラウザは、どのページからもリンクされていない場合でも、サイトのルートから/favicon.icoを要求します。フィードリーダー、ブックマークツール、クローラーの中にも他の場所を探さないものがあるため、ICOファイルは画像フォルダーではなくルートに置いてください。ページのheadでアイコンをリンクしている場合、ブラウザはそれらのリンクを優先します。これにより、最新のブラウザにはPNGファイルを提供し、その他の環境にはICOで対応できます。 MDN のアイコンの説明.
マニフェストを調整する
生成されるsite.webmanifestでは、サイト名がnameとshort_nameの両方に使われます。short nameはホーム画面のアイコンの下に表示されるラベルで、約12文字で途切れるため、名前が長い場合は短くしてください。アイコンには"purpose": "maskable"が記載されていないため、Androidでは白い円の内側に縮小表示されることがあります。ランチャーの形状いっぱいに表示するには、重要な内容を幅の80%の中央の円の中に収めた、別のmaskableアイコンを追加してください。
使い方
- 正方形の画像を選びます。理想は512 × 512以上です。
- manifestで使われるサイト名とテーマカラーを設定します。
- パッケージをビルドしてzipをダウンロードします。
プライバシーと制限事項
画像がブラウザの外に送信されることはありません: すべてのサイズ、ICOコンテナ、zipはお使いのデバイス上で組み立てられます。透過の元画像は透過のままです。
関連ツール
よくある質問
zipには何が含まれていますか?
favicon.ico、favicon-16x16.png、favicon-32x32.png、apple-touch-icon.png、android-chrome-192x192.png、android-chrome-512x512.png、site.webmanifest—一般的なfaviconジェネレーターが慣例的に生成するのと同じセットです。
favicon.icoには複数のサイズが入っていますか?
はい。16 × 16と32 × 32の両方の画像が含まれており、アルファチャンネルを保持できるようPNGエントリとして保存されます。
ファイルはどこに置けばいいですか?
サイトのルートに展開し、HTMLのheadからfavicon-32x32.png、favicon-16x16.png、apple-touch-icon.pngをlink要素で参照し、manifestのlinkはsite.webmanifestを指すようにします。
アップロード後もアイコンが正しく表示されないのはなぜですか?
ブラウザはfaviconを通常のファイルとは別に強力にキャッシュします。PNGのURLを直接開くか、プライベートウィンドウで確認して、新しいファイルが配信されているか確かめてください。
無料ツール · ブラウザ内で · アカウント不要