- 図形数
- —
- SVG サイズ
- —
画像をここにドロップ
クリックして選択 · または貼り付け (Ctrl/Cmd + V)
ブラウザ内で処理 · アップロードなし
PNG・JPG・WebP などのラスター画像（ドットの集まり）を SVG（ベクター画像）に変換するツールです。SVG はいくら拡大してもにじまない図形データなので、ロゴ・アイコン・シンボルマーク・ステッカー・カッティングシート用データ・ピクセルアートなど「色数が少なくエッジがはっきりした絵」をきれいに作り直したいときに向いています。仕組みは、まず画像を指定した色数（2〜16 色）に量子化し、同じ色の領域を塗りパスにまとめて 1 枚の SVG に組み立てる方式です。「色数」を上げるほど元画像に忠実になり、下げるほどフラットでシンプルな（ロゴ向きの）仕上がりになります。「精細さ」を上げると細部まで拾いますが SVG のサイズ（図形数）は大きくなります。変換結果はその場でプレビューでき、図形数と SVG のファイルサイズも表示されるので、用途に合う粒度を探せます。仕上がりは「SVG を保存」でファイルとして、「SVG コードをコピー」でテキストとして取得でき、Illustrator・Inkscape・Figma・Web（HTML/CSS）にそのまま貼り付けられます。Illustrator や Inkscape の「画像トレース」と同じ目的を、ソフトのインストールやアカウント登録なしにブラウザだけで行えます。あなたの画像は作品やロゴそのものなので、本ツールはどこにもアップロードせず、読み込み・変換・保存まですべて端末内（ブラウザ）で完結します。
使い方
- ベクター化したい画像（PNG/JPG など）をドロップ（またはクリックで選択・Ctrl/Cmd+V で貼り付け）します。
- 「色数」スライダー（2〜16 色）と「精細さ」を調整します。画像を読み直さずに即再変換され、図形数と SVG サイズが表示されます。
- 「SVG を保存」でファイルとして、または「SVG コードをコピー」でコードとして書き出し、Illustrator・Inkscape・Figma・Web に貼り付けます。
よくある質問
画像はサーバーにアップロードされますか？
いいえ。読み込み・ベクター化・保存はすべてブラウザ内で行われ、画像はどこにもアップロード・保存・送信されません。あなたの端末内だけで処理されます。
どんな画像がきれいに SVG 化できますか？
ロゴ・アイコン・シンボル・イラスト・ピクセルアートなど、色数が少なくエッジがはっきりした画像が得意です。写真のようにグラデーションや細かい階調が多い画像は、色数を上げても図形数が増えて重くなりがちなので、用途に応じて色数・精細さを調整してください。
「色数」と「精細さ」は何を変えますか？
色数は画像をいくつの代表色にまとめるかです。多いほど元画像に忠実に、少ないほどフラットでロゴ向きの仕上がりになります。精細さはトレースの解像度で、上げると細部まで拾えますが図形数（SVG のサイズ）が大きくなります。プレビューと図形数を見ながら調整できます。
出力した SVG は Illustrator や Inkscape で編集できますか？
はい。標準的な `<path>` で構成した SVG なので、Illustrator・Inkscape・Figma・Affinity などで開いてパスや色を編集できます。HTML/CSS にコードをそのまま貼り付けて Web で使うこともできます。
出力は滑らかな曲線になりますか？
本ツールは色領域を塗りの図形（矩形パス）にまとめる方式なので、曲線へのフィッティングは行わず、量子化した境界をそのままベクター化します。エッジは元の境界に忠実です。より滑らかにしたいときは精細さを上げ、書き出した SVG を Illustrator/Inkscape のパス簡略化で整えると良いでしょう。
透明な背景（透過 PNG）はどう扱われますか？
ほぼ透明な画素は塗らずに透明のまま残すので、切り抜き素材の透過 PNG はそのまま透過 SVG になります。背景の白塗りは加わりません。