TDMO

画像 → SVG 変換 + AI仕上げ

画像をSVGに変換し、AIが元画像と見比べて不要なパスの除去や輪郭のスムージングを行う2段構えの実験ツール。ロゴ・アイコン・線画向け。

1画像をSVGに変換

画像をドロップ、またはクリックして選択

PNG / JPG / WebP / GIF など。ロゴ・アイコン・線画で最も効果的です。

変換エンジン
元画像
画像を選ぶとここに表示されます

色見本をクリックで微調整、× で削除。パレット固定ON時は、ここで選んだ色だけでSVGを作ります。

詳細設定(プリセット・色数・パスの精度)
処理はすべてこのブラウザ内で完結します(画像はアップロードされません)。

① まずローカルで整える(無料・トークン0・おすすめ)

強さ: 不要パス削除・同色統合・透明パス除去・座標丸め
100% 背景:
拡大してエッジのなめらかさを確認できます
元画像
未選択
結果SVG
未変換

2AIがディテールを整える

元画像と変換SVGをAI(vision)に渡し、不要パスの除去・輪郭のスムージング・パス統合を依頼します。結果を見て採用/却下できます。

⚠ トークン使用量にご注意: SVGは情報量が多いため、APIのトークン消費(=コスト)が大きくなりがちです。特にパス数の多いSVGは高額になりやすいので、送信前に「ローカル整形」でSVGを軽くしておくことをおすすめします。各社の利用上限・請求もご確認ください。

元画像
未選択
変換SVG(AI前)
未変換
AI仕上げSVG
未実行
APIキー・CORS・仕組みについて(重要)

これは実験ツールのため「持ち込みキー(BYO key)」方式です。入力したキーはあなたのブラウザのlocalStorageにのみ保存され、変換した画像・SVGとともに各社APIへ直接送られます(当サイトのサーバーは経由しません)。共有PCでの利用は避けてください。

Anthropicはブラウザ直叩き用ヘッダ anthropic-dangerous-direct-browser-access を送っています。OpenAI/Gemini/Kimiも通常はブラウザから呼べますが、各社のCORS設定変更により失敗する場合があります。その際はエラーメッセージが表示されるので、小さなプロキシ経由に切り替えてください。

AIはパス座標を直接書き換えるのが苦手なため、色数の少ないロゴ・アイコン・線画で最も効果を発揮します。写真ではパラメータ調整(1段目)が主役です。

ライセンス・クレジット

本ツールは以下のオープンソースを利用しています。

Potrace(なめらか曲線トレース)— Peter Selinger氏のPotraceのJavaScript移植版(kilobtye/potrace)。GPLライセンスで配布されています。

ImageTracerJS(多色トレース)— András Jankovics氏(jankovicsandras/imagetracerjs)。パブリックドメイン(Unlicense)。

画像の変換・色抽出・整形はすべてご自身のブラウザ内で行われ、画像が外部に送信されることはありません(AI仕上げを実行した場合のみ、選択した各社APIへ送信されます)。

※ 実験ページ。壊れていても気にしない。