PNG から SVG へのベクター変換

このツールはピクセル画像をトレースして、色のついた図形の集まりである SVG に変換します。PNG（または JPEG、WebP、GIF、BMP、AVIF）のファイルをドロップすると、元画像の隣に結果が表示されます。SVG のコードをコピーすることも、.svg ファイルとしてダウンロードすることもできます。

各設定は何をするものですか

4 つのプリセットは、vtracer 公式デモのギャラリーで使われている設定をそのまま持ってきたものです。「標準」はそのデモが最初に表示する状態です。「白黒」は同じ設定に 2 階調トレースを加えたもので、線画や署名、ステンシルに向いています。「ポスター」はノイズ除去を強め、新しいレイヤーを起こすのに必要な色の隔たりも広げるので、フラットな図版が少なくて大きな図形にまとまります。「写真」はさらにノイズ除去を強め、色の情報をいちばん細かく残したうえで、コーナーのしきい値を最大まで上げるため、ほとんどの折れ目が曲線として滑らかに処理されます。個別のつまみを動かすと、プリセットの表示は自動的に「カスタム」に切り替わります。

プリセットの下には、個別のパラメータが並んでいます。「曲線の種類」はピクセル（角ばった輪郭のまま、平滑化なし）、ポリゴン（直線の連なり）、スプライン（滑らかな曲線）から選べます。「ノイズ除去」は指定した大きさの正方形より小さい塊を捨てるので、JPEG のノイズを取り除くのに使えます。「色の精度」は各チャンネルに残すビット数、「レイヤー間の色差」は新しいレイヤーを起こすまでに必要な色の隔たりを決めます。レイヤーは重ねることも、互いに切り抜くこともできます。「曲線フィッティング」のグループ（コーナーのしきい値、セグメント長、分割のしきい値、最大反復回数）はポリゴンとスプラインにしか効かないため、ピクセルモードでは非表示になります。

画像はどこかにアップロードされますか

いいえ。トレース処理はブラウザ内の WebAssembly で動き、しかもバックグラウンドのワーカーで実行されるので、処理中もページは固まりません。画像はいったん canvas に読み込まれてワーカーに渡され、生成されたコードがそのままプレビューに入ります。端末の外にデータが出ることはなく、タブを閉じた後に何かが残ることもありません。

写真を変換するとファイルが巨大になるのはなぜですか

トレースは色の近い領域を探す仕組みなので、グラデーションのなだらかな写真では図形が何千個も重なってしまいます。出力が扱いにくいときは、ノイズ除去を上げ、色の精度を下げ、レイヤー間の色差を大きくしてください。ベクター化は、もともと平坦な色面を持つ画像に向いています。

よくある使いどころは、ビットマップしか残っていないロゴを拡大できるようにすること、スキャンした図面をカッティングマシンやレーザー加工機が追える形にすること、どんなサイズでも輪郭がぼやけない素材を用意することです。トレースはあくまで図形の推測であって元データの復元ではないので、設定の調整は前提と考えてください。フォーマット自体については MDN の SVG ドキュメント が参考になります。トレーサーには VTracer を WebAssembly にコンパイルしたものを使っています。