SVGからdata URIへ（CSS・HTML用）
SVGコードを、CSS（background-image、mask）とHTMLで使える最適化されたdata URIに変換します。Base64より短いURLエンコードで、画像のプレビュー付きです。
使い方SVGコードを貼り付けてください。
利用できる言語: 
広告
SVGからdata URIへ（CSS・HTML用）: 用途
SVGコードを貼り付けて、出力形式を選びます。ツールが余分な空白を取り除き、引用符を置き換え、必要な文字だけをエンコードして、Base64より小さいdata URIを生成し、画像のプレビューと最終サイズを表示します。
使い方
- SVGコードを貼り付けます。
- CSS、data URI、img、Base64から選びます。
- 結果をコピーします。
使うタイミング
- 追加ファイルなしでアイコンをCSSに埋め込む。
- mask-imageでSVGを使う。
- ページのリクエスト数を減らす。
よくある質問
なぜBase64を使わないのですか？
SVGはもともとテキストなので、URLエンコードのほうがBase64より小さくなるのが普通です。エンコードが必要なのは、<、>、#、引用符などの特殊文字だけです。
CSSではどう使いますか？
結果を background-image: url("data:image/svg+xml,...") の形式でコピーしてください。mask-image、list-style-image、img タグの src 属性でも使えます。
本当に無料？
はい、100%無料です。登録不要、サブスクなし、利用制限なし。すべてのツール：Tools123は無料です。