画像 SVG 変換

画像ファイルをアップロード
設定
概要
Generated by AI

ビットマップ画像をスケーラブルベクターグラフィックスに変換するオンラインツールで、色のブロックと輪郭を自動的に識別し、高品質なSVGファイルを生成します。変換後は無損失でスケール可能で、Webデザイン、アイコン作成、印刷物などのシーンに適しています。

機能特徴

自動ベクトル化

PNG、JPGなどのビットマップフォーマット画像をアップロードすると、ツールは自動的に色の分布と形状の輪郭を分析し、パスと形状で構成されるSVGベクターグラフィックスに変換します。カラーと白黒の2つのモードをサポートし、異なるタイプの画像に適応します。

リアルタイムプレビュー比較

変換完了後、ページ上で直接元の画像とSVG効果を比較でき、左右の比較スライダーをドラッグできるため、変換前後の違いを明確に確認し、変換品質が要件を満たすことを確認できます。

豊富なパラメータ調整

複数のパラメータオプションを提供し、画像タイプと品質要件に応じて変換効果を調整できます:

クラスタリングモード

  • カラー: 画像の色情報を保持、カラーイラストや写真に適している
  • 2値: 白黒2色に変換、シンプルなアイコンや線画に適している

階層モード

  • スタック: レイヤーを順番に重ねる、ほとんどの画像に適している
  • くり抜き: 内側のレイヤーが外側のレイヤーをくり抜く、特殊効果に適している

パスモード

  • なし: パスを最適化せず、元の輪郭を保持
  • ポリゴン: 直線セグメントで輪郭を構成、ファイルが小さい
  • スプライン曲線: 滑らかな曲線を使用、効果がより自然

精度制御

  • スポットフィルター: 指定されたピクセル未満のノイズをフィルター、範囲0-20
  • 色精度: 色量子化レベル、1-8、数値が大きいほど色が豊か
  • パス精度: パス簡略化度、1-10、数値が大きいほど詳細が多い
  • レイヤー差: レイヤー色差しきい値、0-255、レイヤー分離度を制御

形状最適化

  • コーナーしきい値: コーナーとして認識される角度、0-180度
  • 長さしきい値: パスセグメントの最小長さ、0-20ピクセル
  • 接合しきい値: パス接合許容角度、0-180度

使用方法

  1. アップロードエリアをクリックして画像ファイルを選択、PNG、JPG、WebPなどの一般的なフォーマットをサポート
  2. 「設定」パネルをクリックしてパラメータを調整(オプション):
    • カラー写真またはイラストは「カラー」モードを使用
    • シンプルなアイコンまたはロゴは「2値」モードを使用
    • 滑らかな効果が必要な場合は「スプライン曲線」を使用
    • 小さなファイルが必要な場合は「ポリゴン」を使用
    • 色精度は6-8に設定して良好な色再現を得ることを推奨
    • パス精度は6-8に設定して詳細とファイルサイズのバランスを推奨
  3. 「変換」ボタンをクリックして処理を開始、プログレスバーの完了を待つ
  4. 結果パネルで比較効果を確認、スライダーをドラッグして元の画像とSVGを比較
  5. 「SVGをダウンロード」をクリックしてベクターグラフィックファイルを保存

応用シーン

Webアイコン作成

PNGアイコンをSVG形式に変換すると、Webページ上で任意にスケールしても劣化せず、ファイルサイズが小さく、読み込み速度が速くなります。

ロゴのベクトル化

ビットマップロゴをベクター形式に変換すると、名刺から看板まで鮮明さを保ち、異なるサイズのシーンで使用するのに便利です。

印刷物の準備

SVGに変換した後は無限に拡大でき、どのサイズでも鮮明でシャープであることを保証し、印刷の高解像度画像要件を満たします。

アニメーション作成

SVGグラフィックスはCSSまたはJavaScriptを使用して簡単にアニメーション効果を作成でき、Webページにインタラクティブ性と視覚的魅力を追加します。

使用ヒント

最高の変換効果を得る

適切な元画像を選択

  • 高解像度の元画像を使用、エッジが鮮明な画像は変換効果が良い
  • 背景がシンプルな画像は変換後のファイルが小さく、品質が高い
  • 圧縮が激しいまたはぼやけた画像の使用を避ける

パラメータ設定の提案

  • シンプルなアイコン: 2値モード + ポリゴンパス + 低色精度(1-3)
  • カラーイラスト: カラーモード + スプライン曲線 + 中精度(5-7)
  • 複雑な写真: カラーモード + スプライン曲線 + 高精度(7-8)

ファイルサイズの最適化

  • 色精度とパス精度を下げるとファイルを削減できる
  • スポットフィルターを増やすと不要な詳細を削除できる
  • スプライン曲線の代わりにポリゴンモードを使用
  • シンプルなグラフィックには2値モードを使用

複数回の調整最適化

最初の変換効果が理想的でない場合、次を試すことができます:

  • クラスタリングモードを調整して2値またはカラーのどちらがより適切かを確認
  • 色精度を増減して色レベルを変更
  • パスモードを変更して輪郭の滑らかさを変更
  • スポットフィルターを調整してノイズを除去

パラメータを変更するたびに「変換」ボタンを再度クリックする必要があります。

注意事項

  • 変換プロセスはブラウザローカルで完了し、画像はサーバーにアップロードされず、プライバシーセキュリティを保護します
  • 変換時間は画像サイズと複雑さに比例し、複雑な画像は長時間かかる場合があります
  • SVGファイルサイズは色数と詳細に影響され、複雑な画像は大きなファイルを生成する可能性があります
  • 写真タイプの画像はSVGに変換した後、ファイルが元の画像より大きくなる可能性があり、写真の変換は推奨されません
  • 変換に適した画像には、ロゴ、アイコン、イラスト、漫画など輪郭が明確なグラフィックスが含まれます
  • 変換後のSVGはベクターグラフィック編集ソフトウェアでさらに編集できます
  • 一部の特殊効果は完璧に変換できない場合があります
  • ダウンロードされたSVGファイルには完全なXML宣言と名前空間定義が含まれており、直接使用できます
もっと見る