ChatGPTでSVGファイルは作れる？

ChatGPTはSVGのコードを書けます。SVGは図形を記述するXMLベースのマークアップ言語、つまりテキストだからです。言葉で説明できるシンプルな図形、アイコン、図なら、コードを頼めば作れます。

一方、画像生成で作られる絵は別の種類のファイルです。ピクセルでできたラスター画像で、MidjourneyやGeminiが作る絵も同じです。たとえばOpenAIの画像生成ガイドでは、出力形式としてPNG、JPEG、WebPが挙げられています。こうした絵をベクターパスにするにはトレースが必要です。色の領域を見つけて、その輪郭をパスにします。

きれいにトレースできるAI画像

トレースは画像を最大24色の平坦な色にまとめ、それぞれの輪郭を描きます。そのため、きれいにトレースできるのは、もともとそういう見た目の画像です。

  • 平坦な単色で塗られている
  • 太くてきれいな輪郭線がある
  • 色が少ない
  • グラデーション、柔らかい陰影、テクスチャがない
  • 背景が単色か透明
  • 画像が大きく、小さな文字がない

ステッカー、ロゴ、アイコン、クリップアート風のスタイルなら、たいていすべて当てはまります。写真のようにリアルな画像、絵画風のスタイル、テクスチャの強い画像は、ポスターのような平坦な色の領域になります。

画像エンジンがPNGで描いた、サングラスをかけたマンガ風のタコスと、そこからトレースしたSVGを並べたもの

ロゴスタジオの画像エンジンが描いた画像（左、PNG）と、そこからトレースしたSVG（右）。平坦な塗り、太い輪郭線、単色の背景なので、40個のパスにトレースできました。

きれいにトレースできる画像を作るプロンプト

プロンプトに次のような言葉を加えてください。

  • 「フラットなイラスト」（flat illustration）
  • 「4色の単色」（4 solid colors）
  • 「グラデーション・陰影・テクスチャなし」（no gradients, no shading, no texture）
  • 「太くきれいな輪郭線」（thick clean outlines）
  • 「白一色の背景」（plain white background）
  • 「文字なし」（no text）

例：

キツネの顔のフラットなイラスト、ベタ塗り4色、グラデーションなし、陰影なし、質感なし、太くくっきりした輪郭線、無地の白い背景の中央に配置、文字なし

結果はPNGなどのラスターファイルのままです。スタイルは、きれいにトレースしやすくするだけのものです。生成ツールによっては、頼めば透明な背景で作れるものもあります。たとえばOpenAIの画像生成ガイドには、透明な背景のオプションが記載されています。お使いのツールでできない場合は、単色の背景を指定し、変換時に「背景を削除」をオンにしてください。

AI画像をSVGに変換する

  1. AIツールから画像をダウンロードします。PNG、JPG、WebPのどれでも使えるので、.webpファイルも先に変換する必要はありません。
  2. このページのアップロード欄にアップロードします。
  3. プリセットを選びます。ほとんどの画像には標準、カットするならCricut／カッティング（PNGをSVGに変換してCricut・シルエットで使う方法）、白黒なら線画／ステンシルです。
  4. 色数（上限）のスライダーを、プロンプトで指定した色数に合わせます。不透明な背景が画像に残っている場合は1色足してください（または背景を削除をオンにします）。
  5. 登録不要の無料の透かし入りプレビューを確認し、図形がずれていればトレースし直します。
  6. 透かしなしのSVGのロックを1クレジットで解除します（アカウントなら無料3クレジット）。

長辺が2048pxを超える画像は、トレースの前にそのサイズに縮小されます。

よくある質問

トレースにAIは使われていますか？

いいえ。トレースはAIではありません。ピクセルを平坦な色にまとめ、それぞれの色の輪郭を直線と曲線で描きます。画像を生成することはありません。

AI画像がWebPでダウンロードされたのはなぜ？

AIツールの中には、コンパクトな画像形式であるWebPで画像を保存するものがあります。png2svg.artはWebPをそのまま受け付けるので、変換せずにアップロードできます。WebPをSVGに変換をご覧ください。

AI画像から作ったSVGは販売できますか？

それはpng2svg.artが管理できない権利によります。画像についてあなたがもともと持っている権利はそのままで、使ったAIツールの利用規約も引き続き適用されるので、そちらを確認してください。png2svg.artが独自にライセンスを与えることはありません。

何色にすればいい？

プロンプトで指定した色数です。不透明な背景が画像に残っている場合は1色足してください（または「背景を削除」をオンにします）。スライダーは2〜24色で、残したい2色が1色にまとまってしまったら、1つ上げてください。詳しくはトレースしたSVGは何色にすればいい？色数の決め方をご覧ください。