PNGをSVGに変換
PNG、JPG、WebPをトレースして、拡大してもぼやけないSVGにします。PNG SVG変換はブラウザ上で行われ、画像はアップロードされません。ロゴやアイコン、線画に向いた機能です。
月更新
ファイルをここにドロップするか、ファイルを選択
ファイルはこの端末の中だけで処理され、アップロードされません。 画像を貼り付けて追加することもできます。
ファイルはお使いのブラウザ上で処理され、端末の外に出ることはありません。
- まとめて一括処理
- どの端末でも使える
- 登録不要
PNGをSVGに変換する手順
- 画像を追加するPNG、JPG、WebPのファイルを、一度に10枚まで、1枚10MBまで追加できます。追加するとすぐに、「ポスタライズ」のプリセットでトレースが始まります。
- プリセットと色数を選ぶ線画なら「白黒」、色の少ないロゴなら「少ない色」、形を細かく残したいなら「詳細」を試してください。設定を変えたら、もう一度「SVGに変換」を押します。
- SVGをダウンロードする1枚ずつ、またはまとめてZIPで保存します。ベクター編集ソフトで開くか、Webページに配置して使えます。
PNGからSVGへの変換で実際に起きること
PNGは色のついたピクセルの集まりで、SVGは図形と曲線の一覧です。この2つを完全に置き換える方法はありません。そこでこのツールは、画像を「トレース」します。似た色のピクセルをまとめて領域にし、その輪郭をベクターのパスとして描き起こします。通常のサイズでは元と近い見た目になり、拡大しても輪郭はくっきりしたままです。
トレースは近似であり、劣化のない変換ではありません。細かい質感やなめらかなグラデーションは平らな色の面になり、文字は編集できる文字ではなく輪郭の図形になります。トレースにはオープンソースのimagetracerjsを使い、すべて端末の中で処理します。
ロゴや線画はきれいに、写真は不向き
ロゴ、アイコン、シルエット、署名、シンプルなイラスト、スキャンした線画は、もともと少ない平らな色とはっきりした輪郭でできているので、きれいにトレースできます。元の画像が大きくて鮮明なほど、できあがるSVGもきれいです。
写真には向きません。写真には何百万もの微妙な色があり、トレースすると見た目が失われるか、小さな図形だらけの巨大なファイルになります。写真は元の形式のまま使ってください。ブランドのロゴを正確に使いたい場合は、制作元から元のベクターデータ（AIやSVG）を入手できないか、先に確認することをおすすめします。
プリセットと上限
初期の「ポスタライズ」は、設定した最大64色までのバランスのよいプリセットです。「白黒」は2色、「少ない色」は4色、「詳細」は小さな図形や細い曲線を残す代わりにファイルが大きくなり、「なめらか」は輪郭を少しぼかして曲線を丸くします。「スムージング」のスイッチを入れると、トレース前に軽くぼかして、ノイズの多い画像の粒を減らせます。
トレースを速くするため、大きな画像は先に縮小されます。長辺は最大1500px（スマートフォンでは1000px）、全体で約400万画素までです。縮小したときは行に表示されます。トレースが3分を超えると中止されるので、色数を減らすか、小さな画像で試し直してください。
- 透過した部分は、SVGでも何も描かれない状態になります。
- 色数が多いほど、ファイルは大きく、処理は遅くなります。少なめから試して増やしてください。
- SVGにはサイズとviewBoxが書き込まれるので、きれいに拡大縮小できます。
よくある質問
PNGを劣化なしでSVGにできますか？
完全には無理です。SVGはベクター、PNGはピクセルなので、画像を図形にトレースします。単純な図は元にかなり近くなりますが、写真は近くなりません。
PNG SVG変換に向いているのはどんな画像ですか？
色数の少ないロゴ、アイコン、シルエット、線画です。「白黒」か「少ない色」を使うと、いちばんきれいになります。
JPGや写真をSVGにできますか？
JPGやWebPも読み込めるので変換自体はできますが、写真では仕上がりが悪いか、ファイルが大きくなります。トレースは図やロゴ向けの機能です。
SVGのほうがPNGより大きくなるのはなぜですか？
細かくトレースすると、パスが大量にできるためです。色数を減らす、「少ない色」にする、スムージングをオンにするなどで軽くなります。
文字は編集できますか？
できません。文字は輪郭の図形にトレースされるため、テキストとしては編集できません。必要な場合は、ベクター編集ソフトで文字を打ち直してください。
画像はアップロードされますか？
いいえ。トレースはブラウザ上で行われ、画像は端末の外に出ません。