手元のPNG素材を拡大して使いたい、色や輪郭を後から直したい場合は、Recraftのベクター化が候補になります。ただし、写真を含む素材もすべて変換するのではなく、元画像の特徴と納品先で必要な編集を先に確認します。SVGを書き出せたことだけで、元画像を正確に再現できたとは判断しません。
この記事は、既存のラスタ画像をRecraftでベクター化し、部分修正して受け手へ渡すための手順です。公式資料に基づく整理で、実際の変換・編集・書き出しは行っていません。以下の素材と検収条件は説明用の架空例です。
目次
元画像のまま使うか、変換するかを決める
まず、何を変えるためにベクターが必要かを一文にします。「大きく使う」だけでなく、マークの色を変える、輪郭の曲がりを調整する、同じ図を複数の大きさで使う、など編集の目的を具体化します。
Recraftの公式ガイドは、単純な形、明確な境界、少ない色の素材を変換に向く例として挙げています。一方、写真、柔らかい陰影、細かい模様やノイズを含む画像では、見た目が変わり、手直しが増える可能性を説明しています。Recraft:Vectorization tips(新しいタブで開く)
表は横にスクロールできます
| 元素材と目的 | 最初の判断 | 確認すること |
|---|---|---|
| 単色の案内マークを大小で使う | ベクター化を検討 | 穴、角、細線が残るか |
| 商品写真を大きな紙面へ置く | 元の写真データを確認 | 必要な寸法での品質。変換で写真らしさを失わないか |
| 線画の一部だけ色を変える | 変換後の部分編集を検討 | 色を変えたい部分を独立して選べるか |
| 正式な文字表記を修正したい | 文字を入力し直す工程を検討 | 変換だけで編集可能な文字へ戻ると決めない |
すでに編集可能な元データがあるなら、それを使えるか先に確認します。PNGを変換し直すより、元の図形や文字を修正する方が意図を保てる場合があります。新しい図案が欲しい場合も、既存画像の再現と新規生成は目的が違います。
変換前に、原本と採用条件を残す
元画像は上書きせず、出所、使用してよい範囲、変更できない形や文字を確認します。画像の背景が図柄の一部なのか、透明にしたい余白なのかも決めます。変換後だけを見ていると、細かな欠落や意図しない背景を見落としやすくなります。
例えば、社内案内用の架空のマークを次の条件で受け付けたとします。
- 外側の円と、内側の二つの穴を残す。
- 指定した一つの図形だけを青へ変え、隣の図形は変えない。
- 文字は含めず、部署名は利用先で別に入力する。
- SVGの編集用データと、確認用画像を分けて渡す。
この例なら、「SVGになった」より具体的に採否を確認できます。実際の案件では、穴の数や配色を元資料の条件に置き換えてください。元データが不鮮明で形を判別できないなら、AIに推測して埋めさせる前に原本を探します。
Recraftで変換し、必要な箇所を整える
公式のSVG Converterページは、画像のアップロード、Vectorize、編集・SVG書き出しの流れを案内しています。同ページのアップロード欄ではJPEG、JPG、PNG、WebP、最大5MBと表示されています。この条件をStudio全体やAPI全体の共通上限へ広げず、使う入口の表示を確認します。Recraft:SVG Converter(新しいタブで開く)
作業は次の順で進めます。
- 原本とは別に、変換対象の画像を用意する。
- 対象画像をアップロードし、Vectorizeを選ぶ。
- 原本と比べ、輪郭、穴、背景、重なりを確認する。
- 必要な部分の色や形を調整する。
- 採用条件を満たした版をSVGとして書き出す。
公式はAdjust colorsによる色数の削減やパレットでの配色変更も案内しています。ただし、色数を減らすと、区別したい部分まで同じ色になる可能性があります。変更後には、用途上必要な区別が残るかを確認してください。
2026年7月9日付のVector Editor紹介では、Studioで画像を選び、図形をダブルクリックしてアンカーポイントを動かしたり、一つの図形だけを再配色したりする操作が説明されています。Recraft:Vector Editor(新しいタブで開く)
想定した部分を選べない場合は、操作を繰り返す前に、ベクター化した結果を選んでいるか、必要な形がどのように分かれているかを見ます。元画像と同じ部品構成や、希望どおりのグループが自動で復元されると前提にしません。修正量が大きければ、単純な原本へ戻すか、編集環境で描き直す方がよい場合もあります。
書き出したSVGを受け手の環境で確認する
Studio上で編集できたことと、納品先で必要な編集ができることは別です。書き出したファイルを、受け手が使うソフトで開き、予定する変更ができるかを確認します。ファイル名の拡張子だけを検収条件にしないでください。
先ほどの架空のマークなら、確認項目は次のようになります。
表は横にスクロールできます
| 確認 | 採用条件 | 戻す理由の例 |
|---|---|---|
| 元画像との照合 | 外円と二つの穴が残る | 穴が一つ埋まった |
| 部分編集 | 指定部分だけ青へ変更できる | 隣の図形も一緒に変わる |
| 利用寸法 | 予定する小サイズでも形を判別できる | 細線や穴がつぶれる |
| 保存後の確認 | 保存して開き直しても必要な形と編集性を保つ | 画像としてしか扱えない |
確認用画像がきれいでも、編集データの問題を解消したことにはなりません。反対に、図形を選択できても、小さく使ったときの読みやすさは別に確認します。修正した後は、変更した箇所と、変えてはいけない隣接部分をもう一度見ます。
渡す版と、残る制約をそろえる
納品時は、元画像、採用したSVG、確認用画像を取り違えない名前で分けます。受け手には、確認した編集ソフト、変更できた部分、別に入力する文字、未確認の用途を短く伝えます。元画像の完全再現や、すべてのソフトでの編集互換性を確認していないなら、その範囲まで保証しません。
料金や書き出し条件は、利用するアカウントの画面と現行の案内で確認してください。無料という入口の見出しだけから、必要な回数、編集、出力、利用条件まで同じだと判断しないようにします。
既存素材を保ったまま修正したい場合は、変換の前後を比べ、必要な部分を編集し、納品先で開き直すところまでを一組にします。変換で手直しが増える素材では、元のラスタ画像を使う、元データを探す、描き直すという選択も残してください。
参考資料
- Recraft:SVG Converter(新しいタブで開く)
- Recraft:Vectorization tips every designer should know(新しいタブで開く)
- Recraft:Meet the Vector Editor(新しいタブで開く)
公式資料の確認日:2026年10月23日。掲載の検収表は設計例で、実変換の結果ではありません。
