テキストからSVG変換ツール

このツールでは、レンダリング時に読み込まれる人気のGoogle Fontsから選択でき、sans-serif、serif、monospace、およびdisplayスタイルをカバーしています。一般的な選択肢にはRoboto、Inter、Open Sans、Montserrat、Latoが含まれ、AntonやOswaldなどの表示用フォントもあります。フォントはGoogle Fonts経由でプレビューにレンダリングされ、SVG出力に埋め込まれるため、ローカルにインストールされていないシステムでも正しいフォントが表示されます。

はい。Iconセクションでは、内蔵のアイコン（Email、Phone、Location、Web、User、Star、Heart）を追加できます。アイコンをテキストの左または右に配置するかを選択でき、アイコンのサイズも独立して調整可能です。アイコンとテキストは単一のSVG要素として合成されるため、デザインツールを使わずにプロフェッショナルな連絡先バッジやラベル付きのグラフィックを簡単に作成できます。

SVG（生のXMLコード）、React JSXコンポーネント（Reactプロジェクトに貼り付け可能）、React Native SVGコンポーネント、PNGラスター画像（レティナ出力用のスケール設定が可能）、およびBase64 Data URI（HTMLのimg srcやCSSのbackground-imageに直接埋め込むためのdata: URLとしてエンコードされたSVG）が利用可能です。ワークフローに応じて、任意の形式をクリップボードにコピーするかファイルをダウンロードしてください。

Data URIはSVGをBase64文字列としてエンコードし、URLとして直接埋め込むものです。外部ファイルを参照する代わりに、src="data:image/svg+xml;base64,..."を使用します。これによりHTTPリクエストが削減され、外部ファイルのホスティングが利用できない環境（一部のメールクライアントでのHTML、ローカルで共有されるHTMLファイル、またはCSSのbackground-imageの値など）で機能します。欠点は、エンコードされた文字列が元のSVGファイルよりも大きくなることです。

はい。Download PNGボタンを押すと、SVGが設定されたスケールでCanvas上にラスタライズされ、PNGファイルとしてダウンロードされます。標準的なディスプレイにはScale 1x、レティナ/高DPI画面には2x以上を使用してください。PNGは、ソーシャルメディアのプロフィール画像、画像のみをサポートするメールクライアント、またはラスター形式のみを受け付けるアプリなど、SVGをサポートしていない宛先で便利です。

Background Colorの下にある「Transparent」チェックボックスをオンにします。透明が有効になると、SVGの背景属性が削除され、PNGエクスポートは透明な背景を使用します。これは、白い枠なしで異なる色の背景の上に配置する必要があるロゴやバッジに不可欠です。

いいえ。すべてのSVG生成、レンダリング、およびエクスポートはブラウザ内で行われます。フォントファイルは通常のフォント読み込みの一部としてGoogle Fonts CDNから取得されますが、実際のテキストコンテンツがデバイスから外へ送信されることはありません。データはバックエンドサーバーに送信されず、保存もされません。