コンテンツにスキップ
Monu Tools

Faviconジェネレーター

任意の画像から完全なfaviconセットを生成。.ico、PNG各サイズ、Apple touch icon、web manifestをブラウザ上で作成します。

Faviconジェネレーターの使い方

  1. 01

    正方形の画像をアップロードしてください。シンプルなロゴやアイコンが最適で、処理はブラウザ上で行われます。

  2. 02

    必要に応じて背景色を選び、web manifest用のサイト名を入力してください。

  3. 03

    ZIPをダウンロードし、HTMLスニペットをページのheadに貼り付けてください。

ファビコンとは

ファビコンは、ブラウザのタブ、ブックマーク、電話のホーム画面に表示される小さなアイコンです。これは、サイトが完成したように見え、認識しやすくするための小さな詳細であり、最新のブラウザーはそのいくつかのバージョンを期待しています。

1 枚の画像では不十分な理由

そこが問題です。もう 1 枚の画像では十分ではありません。クラシック ブラウザ用の複数サイズの .ico、個別の PNG サイズ、iOS ホーム画面用の Apple タッチ アイコン、Android 用の大きな PNG、サイトをインストールできるようにする場合は Web マニフェストが必要です。

このジェネレーターは、実際のマルチサイズ .ico を含む単一の画像からセット全体を構築し、ページ ヘッドにドロップする正確な HTML スニペットを提供するため、アセンブルしたり手書きしたりする必要はありません。

どのような画像をアップロードするか

最良の結果を得るには、少なくとも 512 ピクセルの正方形の画像をアップロードしてください。アイコンは非常に小さく表示されることが多いため、詳細な写真ではなく単純なロゴやマークが理想的です。非正方形の画像は中央に配置され、正方形にパディングされるため、端付近の詳細がマージンに収まる可能性があります。

背景色とサイト名

オプションで背景色とサイト名を設定できます。サイト名は、誰かがサイトをホーム画面に追加するときに使用される Web マニフェストに組み込まれます。

ブラウザで実行

Canvas API を使用してすべてがブラウザーでローカルに実行されるため、画像がアップロードされることはありません。すべてのファイルと貼り付けるスニペットを含む ZIP をダウンロードします。

よくある質問

faviconパッケージには何が含まれていますか?

16、32、48 pxを含むfavicon.ico、個別の16 pxおよび32 px PNG、180 pxのApple touch icon、Android用の192 pxと512 px PNG、site.webmanifest、そしてページのheadに貼り付けるHTMLスニペットが含まれています。

どのような画像をアップロードすればよいですか?

512 px以上の正方形の画像が最適で、シンプルなロゴやマークが理想的です。正方形でない画像は中央揃えでパディングされて正方形になるため、端の近くの細部が余白の内側に収まる場合があります。

画像はサーバーにアップロードされますか?

いいえ。アイコンはCanvas APIを使ってブラウザ上で生成されるため、画像がデバイスの外に送信されることはありません。

出典

問題を報告する