無料ツール・SVG変換
画像をSVGに変換してベクター化
ピクセル画像をベクターに変換すると、ファビコンから看板まで、拡大してもぼやけないロゴとして使えます。PNG・JPGを追加し、プリセットを選んでSVGを保存。トレースはすべてブラウザ内で行います。
ブラウザー内でベクター化
ImageTracer 1.2.6・パブリックドメイン・このタブ内で処理
ロゴ、アイコン、イラストを選択
色数が少なく輪郭がはっきりした画像に適しています。複雑な写真はSVGが大きくなり、形が乱れる場合があります。
画像をドロップ・選択・貼り付け
使い方
画像をベクター化する手順
画像を追加
色がはっきり分かれたロゴ、アイコン、図表、線画に適しています。背景のきれいなPNGが特に向いています。
プリセットを選択
色数が少なく輪郭の明確な画像には「ロゴ」、色彩の豊かな作品には「イラスト」、スキャンや線画には「白黒」を選びます。
色数を調整
色を少なくすると、すっきり軽量で編集しやすいSVGになります。必要な部分が消える場合に色数を増やしてください。
プレビューして保存
SVGのプレビューを拡大して元画像と比較し、任意のサイズに拡大できるファイルをダウンロードします。
仕上がりを見る
作例で使い方を確認
ピクセルのマークを拡大可能なパスに
このような輪郭が明確で色数の少ないマークは、ロゴプリセットのトレースに適しています。
編集前
編集後活用例
画像をSVGにしたい場面
ロゴのデータを用意する
会社のロゴが古いメール内の小さなPNGしかないのに、印刷会社やウェブ制作者からベクターファイルを求められた場合に。
カッティングや彫刻
カッティングマシンやレーザー彫刻機はベクターパスを使います。絵をSVGにトレースすれば、機械で加工できる形に近づけられます。
どのサイズでも鮮明な図版
サイトのアイコンやイラストは、SVGなら高密度画面でも鮮明に表示できます。元のPNGより小さな容量になる場合もあります。
できること
画像ベクター化ツールの機能
3つのプリセット
ロゴ、イラスト、白黒の各モードが作品に合うトレース設定を用意します。難しいパラメーターの理解は不要です。
並べて比較
ダウンロード前にSVGと元画像を任意の倍率で比較し、実際に使う前に仕上がりを確認できます。
透明部分を保持
透明背景のロゴはSVGでも透明背景のまま出力され、さまざまな背景に重ねられます。
端末内で実行
このページに組み込まれたトレース機能が画像を端末内で処理します。公開前のブランド素材を外部に送りません。
01 / 利用のヒント
ベクター化でできること・できないこと
トレースは似た色の領域を幾何学的な形で描き直します。そのため単色領域の多い作品には強い一方、細かな色の変化が無数にある写真は苦手です。写真ではポスター調に簡略化されるか、複雑で大きなファイルになります。表現として使えますが、写真の忠実な再現は期待しないでください。
仕上がりは元画像次第です。鮮明な800pxのロゴはきれいにトレースできますが、ぼやけた100pxの画像では輪郭が揺らぎます。小さな画像しかない場合は、先にAI画像拡大を使い、鮮明にしたものをベクター化してください。
次の作業へ
関連ツール
よくある質問
画像→SVG変換のよくある質問
SVGとPNGの違いは？
PNGは画素で保存するため、大きく拡大するとぼやけます。SVGは図形を数式で表すため、16pxのファビコンから車体ラッピングまで鮮明さを保てます。印刷会社や開発者がベクターを求める理由です。
写真もベクター化できますか？
できますが、忠実な写真ではなくポスター風に簡略化されます。トレースは単色の領域に向くため、アート効果としては使えますが、写真をそのまま自由に拡大する用途には適しません。
SVGの色は元のロゴと完全に一致しますか？
元画像から代表色を選び、保持する色数を指定できます。ブランドの正確な色が必要なら、出力後にSVG編集ソフトで各図形の塗りを公式のカラーコードに設定してください。
変換後のSVGを編集できますか？
はい。Illustrator、Inkscape、Figmaやテキストエディターで開けます。各図形は個別のパスなので、色変更、移動、削除ができます。
作品はトレースのためにアップロードされますか？
いいえ。ページに含まれるトレースライブラリがブラウザ内で動きます。元画像も生成したSVGも当社へ送られず、公開前のデザインにも使えます。