ファビコン・ICO — 入力準備

ファビコン・ICO — 入力準備:ファビコンの元画像は、512×512ピクセル以上の正方形のロゴマークを用意し、できれば背景を透明にしてください。

画像の端を切り取らずに標準アイコンサイズを作成します。

またはこのページのどこにでも画像を1つドロップ

favicon.ico には 16、32、48、64、256 px のフレームが含まれます。PNG は表示サイズで保存され、180 px は apple-touch-icon.png として保存されます。

画像を選択してください。

ICO と PNG のファビコンを作成

入力と出力の例

ファビコンの元画像は、512×512ピクセル以上の正方形のロゴマークを用意し、できれば背景を透明にしてください。出力はすべてこの大きさから最小16×16まで縮小されます。

Chatcumentは画像を切り取らずに512×512のキャンバスへ収め、そこから16・32・48・64・180・192・256・512のPNG8種類とfavicon.icoを作ります。1200×300のような横長のロゴタイプは正方形の中央に細い帯として置かれて上下が空き、16ピクセルでは線のようにしか見えません。

たとえばパン屋さんのロゴが店名入りの横長看板なら、パンのシンボルや頭文字だけを正方形にした別ファイルを元画像にするのがおすすめです。図形がタブの端に接しないよう、周囲に1割ほどの余白を残します。

よくある失敗は、64×64のファイルやスクリーンショットをそのまま使うことです。ツールが先に512へ拡大するため、どのサイズもぼやけます。512ピクセル以上のPNG・WebP、またはSVGを使ってください。JPGは透明を持てないので、暗いブラウザーテーマではマークの周りに白い四角が出ることがあります。

ダウンロードの前に、プレビューの16×16と32×32を拡大せず実寸で見てください。2秒で何の形か分からなければ、図形を減らし、線を太くし、小さな文字を外して単純にします。

入力

Square mark or logo

出力

PNG sizes + multi-size ICO

対応形式はPNG、JPG、WebP、GIF、SVG、AVIF、BMPで、1回に1枚ずつ。処理はすべてブラウザー内で行われます。

作業別ツール 6
関連ツール 13
ファビコン・ICO — 入力準備の使い方
  1. ファビコン・ICO — 入力準備 に使う元画像を選びます。
  2. プレビューで生成された PNG アイコンサイズを確認します。
  3. 必要な PNG サイズまたは複数サイズを含む ICO ファイルをダウンロードします。

よくある質問

ファビコン・ICO — 入力準備 では何ができますか?

ファビコン・ICO — 入力準備:ファビコンの元画像は、512×512ピクセル以上の正方形のロゴマークを用意し、できれば背景を透明にしてください。

ファビコン・ICO — 入力準備 はどのように使いますか?

ファビコン・ICO — 入力準備 に使う元画像を選びます。 プレビューで生成された PNG アイコンサイズを確認します。 必要な PNG サイズまたは複数サイズを含む ICO ファイルをダウンロードします。

ファビコン・ICO — 入力準備 の結果はどのように受け取れますか?

生成された PNG サイズと複数サイズを含む ICO ファイルをすぐにダウンロードできます。

編集した画像を公開する前に何を確認しますか?

書き出したファイルを開き、使用時のサイズで画素数・容量・小さな文字・輪郭・透明部分を確認してください。サイズ変更は画素数、圧縮は容量を調整します。拡大しても失われた細部の復元は保証されません。設定を変えて再出力できるよう原本を保管してください。