ファビコン生成 — PNG/SVGから複数サイズICO
ロゴや正方形のマークをサイトのファビコンに：複数サイズを一つの `.ico` にまとめ、タブ・ブックマーク・一部ショートカットをはっきりさせます。背景のきれいな中央寄せのシンプルな正方形から — 細かいディテールは 16×16 で泥になります。
ここにファイルをドロップ、またはクリックして選択
ファビコンはタブでサイトを見分ける小さな印。多くのサイトは web マニフェストに PNG も置きますが、ICO は広い互換のための複数サイズ束として依然有用です。
正方形の元が最適。横長ロゴはフィットモード次第でレターボックスや切り抜き — 必要なら先に 正方形に切り抜き。
小さいサイズでは強いコントラストが効きます：細い薄グレーの線はタブバーで消えます。小さな文字より大胆な形。
生成の手順
- できるだけ正方形のロゴをアップロード
- サイズセットとフィットモードを選ぶ
- favicon.ico をダウンロード
- サイトルートに置くか、フレームワークのドキュメントどおりにリンク
生成器が省く手間
- よく使うサイズを一括で — 16 や 32 の抜けを減らす。
- すぐに使える `.ico` をダウンロード — 手組み不要。
- 正方形ロゴを上げてすぐサイトに載せられる。
誰向け
- まだタブアイコンがない新サイト
- リブランド色に合わせてファビコン更新
- 従来ホスト向けに PNG ロゴから素早く ICO
デザインのヒント
- 元は少なくとも 256×256、またはベクター SVG の方がきれいに縮む。
- キャッチコピー全文をアイコンに詰め込まない。
- 生成後、実ブラウザのタブで確認。
- PWA はマニフェストに別 PNG が要ることもあります。
入力の目安
| 入力 | 出力 | 備考 |
|---|---|---|
| 正方形 PNG ロゴ | 複数サイズ favicon.ico | いちばん多い |
| SVG アイコン | ラスタ化して ICO に | 線幅に注意 |
ファビコン FAQ
- PNG だけでファビコンは？
- 多くの現代ブラウザは可能。ICO は古い環境に有利；両方使うのも一般的です。
- SVG だけをファビコンに？
- 対応は広がっていますが、ICO/PNG の組み合わせの方が安全です。
- なぜ 16×16 が読めない？
- 元のディテールが多すぎます。単純化するか、小さな専用マークを設計してください。