アイコン・ファビコン生成ツール（無料・登録不要）
登録不要 無料 ブラウザ完結
このツールの特徴: テキスト1〜3文字を入力して5形状（円/四角/角丸/ハート/星）・30種以上のプリセットから選ぶだけ。PNG/SVG/ICOの3形式、16〜1024pxの7サイズを個別またはZIP一括ダウンロード。グラデーション・ドット・ストライプ背景、フォント選択、シャドウ設定対応。ブラウザ完結・登録不要・サーバー送信なし。
出力サイズ
1〜3文字推奨。絵文字対応。16px/32px等の小サイズでは1文字が最適。
形状
背景
境界線（ボーダー）
テキスト位置
ファイル名
アイコン・ファビコンの作り方（4ステップ）
- テキストを入力する — 「テキスト」タブで1〜3文字（日本語・英字・絵文字）を入力。プレビューがリアルタイム更新されます
- 形状と背景を選ぶ — 「形状・背景」タブで円/四角/角丸/ハート/星を選択。背景は単色・グラデーション・ドット・ストライプから設定
- サイズと形式を選ぶ — 用途に合わせてサイズ（16〜1024px）と形式（PNG/SVG/ICO）を選択
- ダウンロード — 「ダウンロード」で個別取得、または「全サイズ ZIP」でファビコン用7ファイルを一括取得
ファビコン（favicon）はブラウザのタブやブックマークに表示される小さなアイコンです。サイトのブランド認知に直結するため、視認性の高いデザインが重要です。
2026年推奨のファビコン構成
| ファイル | サイズ | 用途 | 形式 |
|---|---|---|---|
| favicon.ico | 16/32/48px 内包 | ブラウザタブ（全ブラウザ対応） | ICO |
| favicon-16x16.png | 16 × 16 px | 古いブラウザ互換 | PNG |
| favicon-32x32.png | 32 × 32 px | 標準ブラウザタブ | PNG |
| apple-touch-icon.png | 180 × 180 px | iOS ホーム画面追加 | PNG |
| android-chrome-192x192.png | 192 × 192 px | Android ホーム画面 | PNG |
| android-chrome-512x512.png | 512 × 512 px | PWA スプラッシュ | PNG |
| icon.svg | スケーラブル | モダンブラウザ（推奨） | SVG |
最小構成（3ファイル）: favicon.ico + apple-touch-icon.png(180px) + favicon-32x32.png でほぼ全環境に対応できます。
各SNSのプロフィール画像は正方形で入稿し、プラットフォーム側が円形に切り抜くケースがほとんどです。
| SNS | 推奨入稿サイズ | 表示サイズ | 形状 |
|---|---|---|---|
| Twitter / X | 400 × 400 px | 200 × 200 px | 円形に自動クリップ |
| 320 × 320 px | 110 × 110 px | 円形に自動クリップ | |
| YouTube | 800 × 800 px | 98 × 98 px | 円形に自動クリップ |
| 180 × 180 px | 40〜160 px | 円形に自動クリップ | |
| LINE | 640 × 640 px | 最大640 px | 円形に自動クリップ |
| note | 512 × 512 px | 可変 | 円形に自動クリップ |
本ツールの512×512px出力（PNG）がSNSプロフィール用途に最適です。
ブログ・Webサービス・PWA（プログレッシブウェブアプリ）向けアイコンサイズの一覧です。
PWA / Web アプリアイコン
- 192×192px（PNG）- manifest.json の icons 必須サイズ
- 512×512px（PNG）- PWA スプラッシュスクリーン・高解像度対応
- 1024×1024px（PNG）- マスタースケールから縮小用
manifest.json 記述例
{
"icons": [
{ "src": "/icons/icon-192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "/icons/icon-512.png", "sizes": "512x512", "type": "image/png" },
{ "src": "/icons/icon.svg", "sizes": "any", "type": "image/svg+xml" }
]
}SVGアイコンは "any" サイズ指定で全解像度に対応できるため、本ツールのSVG出力が特に有効です。
WordPress
- 「外観」→「カスタマイズ」→「サイト基本情報」→「サイトアイコン」
- 512×512px 以上の画像（正方形）をアップロード推奨
- WordPress が自動で各サイズに縮小 + <link rel="icon"> を出力
はてなブログ
- 「設定」→「詳細設定」→「ファビコン」からアップロード
- 16×16〜256×256px の PNG 推奨
Astro（本ツールのサイトと同じ構成）
<!-- src/layouts/Layout.astro の <head> に追加 -->
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />主要アイコン生成ツールとの機能比較（2026年5月調査）。
| ツール | 形状 | SVG出力 | ICO出力 | プリセット | パターン背景 | 登録 |
|---|---|---|---|---|---|---|
| 本ツール（tools-navi.jp） | 5形状 | ✔ | ✔ | ✔ 30種+ | ✔ | 不要 |
| favicon.io | 3形状 | ✗ | ✔ | ✗ | ✗ | 不要 |
| ao-system.net | 画像のみ | ✗ | ✔ | ✗ | ✗ | 不要 |
| Canva（アイコンメーカー） | 多数 | △ 有料 | ✗ | ✔ 多数 | ✔ | 要登録 |
| rakko.tools/69 | 画像のみ | ✗ | ✔ | ✗ | ✗ | 不要 |
※ 2026年5月現在の調査。各サービスの仕様は変更される場合があります。
- Q 作成したアイコンは商用利用できますか？
- A はい、完全無料・商用利用可能です。登録不要でダウンロードしたアイコンの著作権はご自身に帰属します。本ツールのプリセットカラーやデザインを使ったアイコンもご自由にお使いください。
- Q ICOファイルとは何ですか？PNGと何が違いますか？
- A ICO形式はWindows・全ブラウザが標準サポートする「マルチサイズアイコン形式」です。1つのICOファイルに16/32/48pxなど複数サイズを内包できます。PNGはより汎用的ですが、1サイズ1ファイルです。ブラウザタブのファビコンにはICOが最も互換性が高く、モダンブラウザにはSVGが理想的です。
- Q SVGアイコンの利点は何ですか？
- A SVGはベクター形式のため、どんな解像度・サイズに拡大縮小しても画質が劣化しません。HiDPIディスプレイや4K環境でも鮮明に表示されます。ファイルサイズも小さく、manifest.jsonで "sizes": "any" として全解像度に一括対応できます。デメリットは古いブラウザ（IE11以下）で非対応な点ですが、2026年現在は問題になりません。
- Q 日本語（漢字・ひらがな）のアイコンは作れますか？
- A はい。テキスト欄に日本語を入力できます。ただし16×16px・32×32pxなど極小サイズでは2文字以上が潰れて読めなくなる場合があります。ファビコン用途では1文字（漢字1字 or 英字1〜2字）を推奨します。フォントはゴシック体が最も視認性が高く、明朝体は小サイズで潰れやすいです。
- Q 全サイズZIPに含まれるファイルは何ですか？
- A 全サイズZIPには favicon.ico（16/32/48px内包）、favicon-16x16.png、favicon-32x32.png、apple-touch-icon.png（180px）、icon-192x192.png、icon-512x512.png、icon-1024x1024.png、icon.svg の合計8ファイルが含まれます。Webサイトのfaviconとして必要なファイルがそろいます。
- Q ハート形・星形のアイコンはどんな用途に使えますか？
- A ハート形はSNSの「いいね」系アプリ・恋愛・ウェルネス系サービスのアイコンに最適です。星形はレビュー・評価・お気に入り機能のアイコン、または個人ブランドのロゴ代わりとして使われます。いずれも16px〜32pxの小サイズでは細部が潰れるため、SNSプロフィール（256px以上）やPWAアイコン（192px以上）用途に向いています。