テキスト・絵文字からSVG形式のファビコンを生成し、プレビュー・ダウンロードできます。
48px
0°
プレビュー
ブラウザタブプレビュー
linkタグ
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2064%2064%22%3E%0A%20%20%3Crect%20width%3D%2264%22%20height%3D%2264%22%20rx%3D%228%22%20fill%3D%22%233b82f6%22%20%2F%3E%0A%20%20%3Ctext%20x%3D%2232%22%20y%3D%2232%22%20text-anchor%3D%22middle%22%20dominant-baseline%3D%22central%22%20font-family%3D%22sans-serif%22%20font-size%3D%2248%22%20font-weight%3D%22bold%22%20fill%3D%22%23ffffff%22%3EF%3C%2Ftext%3E%0A%3C%2Fsvg%3E" /> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" /> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" /> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
SVGコード
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <rect width="64" height="64" rx="8" fill="#3b82f6" /> <text x="32" y="32" text-anchor="middle" dominant-baseline="central" font-family="sans-serif" font-size="48" font-weight="bold" fill="#ffffff">F</text> </svg>
ダウンロード
ファビコン生成でできること
テキスト・絵文字からファビコンを簡単に作成できます。SVGモード・絵文字モード・テキストモードの3種類の入力方式に対応し、リアルタイムプレビューを確認しながらSVG・PNG(複数サイズ)・ICO形式でダウンロードできます。ダークモード対応のファビコン生成やlinkタグの自動生成にも対応しています。
使い方
- SVGモード
- テキスト(1〜2文字)、背景色、文字色、形状(角丸・円・四角)、文字サイズ、回転角度を設定してSVGファビコンを生成します。ダークモード版の同時生成にも対応しています。
- 絵文字モード
- 好きな絵文字を入力してファビコンを生成します。背景は透明または任意の色を選択できます。
- テキストモード
- 1〜2文字のテキストからファビコンを生成します。フォント(Sans-serif、Serif、Monospace、Cursive)、文字色、背景色、太さ(Normal、Bold、Black)をカスタマイズできます。
- プレビュー・ブラウザタブプレビュー
- 生成したファビコンを実際のサイズとブラウザタブでの見え方で確認できます。
- linkタグ・SVGコード
- HTMLに貼り付けるlinkタグとSVGソースコードが自動生成され、コピーボタンで取得できます。
- ダウンロード
- SVG、PNG(16x16〜512x512の6サイズ)、ICO形式で個別にダウンロードできるほか、一括ダウンロード(ZIP)にも対応しています。