画像を SVG に
PNG、JPG、WebP、GIF、BMP、AVIF、TIFF を SVG にベクター化
PNG、JPG、WebP、GIF、BMP、AVIF、TIFF を、きれいで拡大自在な SVG パスにベクター化します。最大 40 件を一括処理でき、カラーまたは白黒のトレースを選んで結果を ZIP でダウンロードできます。アップロードは行わず、初回訪問後はオフラインでもトレースできます。
新規ファイルの既定値を編集しています
プレビュー
SVG とは
SVG(Scalable Vector Graphics)は XML をもとにしたベクター画像形式です。ピクセルではなく、図形、パス、塗り、線を数式で表すため、どんなサイズで描画しても品質が落ちません。
SVG は Web における標準のベクター形式です。最新のブラウザはすべて標準で対応し、CSS でスタイルを指定でき、JavaScript や SMIL でアニメーションもできます。同等のラスター画像に比べてファイルサイズも大幅に小さくなります。
対応する入力形式
ベクター化エンジンは PNG、JPG、WebP、GIF、BMP、AVIF、TIFF に対応しています。アニメーション GIF は最初のフレームだけをトレースします。
画像を SVG に変換するのはどんなとき
ラスター画像をベクター化すると、拡大、色替え、編集が自由にできる解像度非依存のファイルが手に入ります。ラスターをベクターに変換するこのツールは、印刷解像度のロゴ、レーザーカットや刺繍用のきれいな線画、低解像度の素材から作る拡大自在なイラストが必要なときに、PNG、JPG、WebP などを SVG に変換します。ロゴやアイコンは 2〜15 KB に収まるのが一般的で、写真を入力すると細部が簡略化された 50〜300 KB の SVG になります。平坦な色の素材ほど良い結果になります。複雑な写真もトレースできますが、SVG が元の PNG より大きくなることがあります。
元の形式を選ぶ
PNG、JPG、WebP、GIF、BMP、AVIF、TIFF はいずれもベクター化できますが、元画像の質が結果を左右します。きれいな元画像ほど小さく整った SVG になります。
画像を SVG にオンラインで変換する方法
- ファイルをドロップするか「ファイルを選択」を押してキューに追加します。一度に最大 40 件です。
- 出力設定(サイズ、DPI、背景、品質、トレースの細かさ)を指定すると、プレビューがその場で更新されます。
- 「すべて保存」を押すと結果をダウンロードできます。キューに複数ある場合は 1 つの ZIP になります。
プライバシー:ファイルはブラウザから出ません
ファイルが端末の外に出ることはありません。変換は JavaScript と WebAssembly を使ってすべてブラウザ内で実行されます。アップロードもサーバー処理もないため、ファイルに関する情報がどこかへ送られることはありません。
何もアップロードされないため、社外秘のロゴ、社内文書、未公開の顧客作品にも安心して使えます。使用中に端末へキャッシュされるので、初回訪問のあとはネットワーク接続がなくても動作します。
よくある質問
どの画像形式をベクター化できますか?
PNG、JPG、WebP、GIF、BMP、AVIF、TIFF です。1 回に最大 40 件をドロップでき、トレースした SVG は 1 件ずつでも、まとめて 1 つの ZIP でもダウンロードできます。アニメーション GIF は最初のフレームだけをトレースします。
写真もトレースできますか?
実行はできますが、写真は大きくてポスター調の SVG になり、元のファイルより大きくなることもあります。平坦な色と鮮明な輪郭を持つロゴ、アイコン、線画のほうがはるかにきれいにトレースできます。写真をトレースする場合は、ノイズ除去を強め、色の精度を下げると結果を扱いやすく保てます。
透過背景はトレース後も残りますか?
はい。PNG、WebP、AVIF の透明な部分は SVG でも透明のままなので、どんな背景の上にもきれいに重ねられます。JPG にはもともとアルファチャンネルがありませんが、トレーサーは検出した図形だけを描くため、白黒のしきい値を高めにするか色数を減らせば背景を取り除けます。
アニメーション GIF を SVG に変換できますか?
最初のフレームだけが使われます。出力は 1 枚の静止した SVG です。
出力される SVG ファイルを小さくするにはどうすればよいですか?
まず「軽量」プリセットを試してください。パスの形式をポリゴン(曲線ではなく直線)に切り替え、ノイズ除去を強め、色の精度を下げて出力される色レイヤーを減らします。そこからグラデーション段階を上げて近い色をまとめ、最大セグメント長を増やして短いセグメントを長いものにまとめられます。トレードオフとして、色の精度が高くパスがスプライン、ノイズ除去が弱い設定は元に最も忠実ですが、ファイルは最も大きくなります。
形をもっと単純にしたり、細部を減らしたりできますか?
「形状を簡略化」プリセットをお試しください。角のしきい値を上げて検出される角を減らし(曲線がなめらかになります)、最大セグメント長を増やして小さなパスをまとめ、接合のしきい値を上げて曲線をより積極的にまとめます。ノイズ除去を強めると、トレース前に細かな点も取り除けます。元に近づけたい場合は、これらのしきい値を下げ、色の精度を高くしたカラーモードを使い、ノイズ除去を弱めてください。細部は残りますが、SVG は大きくなります。