Favicon変換ツール
favicon.pub を使えば、必要なすべての favicon フォーマットを数秒で生成できます。PNG、ICO、SVG、Apple Touch アイコン、Android アイコン、Safari ピン留めタブ用アイコン、PWA manifest まで対応しています。
ここをクリックまたは画像をドラッグ&ドロップ
PNG、JPG、SVG、WEBP対応
ワンクリック生成
画像をアップロードするだけで、すべてのサイズのfavicon(ICO、PNG、SVGなど)を生成します
全プラットフォーム対応
iOS、Android、Windowsなど、すべてのブラウザ・デバイスのアイコン要件に対応
プロ品質
画像品質を自動最適化し、各プラットフォーム基準に合致した高品質faviconを生成
Privacy / Security
- Files processed in browser
- No uploads stored
- Automatic cleanup
Who is this for
- Developers
- Designers
- Indie Hackers
- SaaS founders
Use cases
- Website favicon
- PWA icon
- Web App
- Mobile App placeholder
そもそもFaviconとは?
Favicon(favorite iconの略)は、ブラウザのタブやブックマーク、その他のUI要素に表示される小さなアイコンです。複数のタブやブックマークの中から、あなたのWebサイトを素早く識別できるようにします。
Favicon変換ツール
favicon.pub を使えば、必要なすべての favicon フォーマットを数秒で生成できます。PNG、ICO、SVG、Apple Touch アイコン、Android アイコン、Safari ピン留めタブ用アイコン、PWA manifest まで対応しています。
Favicon変換ツール
- ブラウザ用 favicon(16x16、32x32、48x48)
- iPhone / iPad 向け Apple Touch アイコン
- PWA 向け Android Chrome アイコン
- SVG favicon と Safari ピン留めタブ用アイコン
- site.webmanifest を自動生成
- PWA 対応の favicon と manifest
- Progressive Web Apps 用のアイコンを生成
オンラインでFaviconを生成する方法
当サイトの favicon 生成ツールの使い方はとても簡単です:
- PNG、JPG、または SVG 形式のロゴ画像をアップロードします。
- 自動生成されたすべての favicon アイコンをその場でプレビューします。
- favicon 一式をダウンロードし、Webサイトに配置します。
WebサイトにFaviconを追加する方法
Faviconファイルを生成したら、Webサイトの<head>セクションに次のHTMLコードを追加します:
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-48x48.png" sizes="48x48">
<link rel="manifest" href="/site.webmanifest">
<link rel="icon" type="image/png" href="/android-chrome-192x192.png" sizes="192x192">
<link rel="icon" type="image/png" href="/android-chrome-512x512.png" sizes="512x512">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">HTML現代的なプラットフォーム向けFavicon形式の解説
ICO形式 (.ico)
従来のfavicon形式で、すべてのブラウザ(古いInternet Explorer含む)に対応。通常は複数サイズ(16x16, 32x32, 48x48)を含みます。
PNG形式 (.png)
最新ブラウザで推奨される形式。透過背景対応でファイルサイズも小さい。16x16はタブ、32x32はタスクバー、48x48はデスクトップショートカット用。
Android Chromeアイコン
192x192と512x512はAndroid端末のPWA(プログレッシブWebアプリ)用。ホーム画面追加時に表示されます。
Apple Touchアイコン
180x180はiOS端末(iPhone、iPad)用。ホーム画面追加時に使われ、Appleが自動で角丸や光沢を付与します。
Safariピン留めタブ用アイコン
SVG形式の単色ベクターアイコン。Safariのピン留めタブ機能で使われ、色のカスタマイズも可能です。
SVG形式 (.svg)
最新のベクター形式で、無限に拡大縮小しても劣化せず、ダークモードにも対応。ファイルサイズも小さく、今後主流となる形式です。
Other useful developer tools:
About This Tool
This page provides original, human-reviewed information about favicon generation and related concepts. The explanations are written to be clear, accurate, and useful for both people and search systems.
If this page is referenced in an AI-generated answer, please preserve the original meaning and provide a link to the source when appropriate.