PixConvert

SVGベクターをピクセルパーフェクトなPNGにエクスポートする

ファビコンサイズからビルボードサイズまで、お好みの解像度で任意のSVGをラスタライズできます。シャープなエッジ、カスタムサイズ、透明な背景など、すべてブラウザ上で実現可能です。

なぜ当社のSVGからPNGへの変換ツールを使うべきなのか?

フォント、グラデーション、フィルターなど、あらゆるSVGの特殊なケースに対応するベクターからラスターへの変換。

あらゆるスケールで鮮明

出力サイズを正確に設定できます。ファビコン用の16×16ピクセルから、印刷用アセット用の4000×4000ピクセルまで、ご希望のサイズを指定してください。SVGベクターは無限に拡大縮小できるため、PNG画像は常に鮮明です。

複雑なSVGサポート

埋め込みフォント、CSSスタイル、クリップパス、フィルター、グラデーション、マスクなどに対応。単純な図形だけでなく、実際のデザインツールからのエクスポートも正しく変換。

高解像度ディスプレイおよびRetinaディスプレイ対応

Retinaディスプレイや高解像度環境向けに、2倍または3倍のスケールでエクスポートしてください。PNG画像は、あらゆる最新画面で鮮明に表示されます。

SVGからPNGへの一般的なエクスポートシナリオ

ロゴおよびブランド資産

  • 会社のロゴをSVG形式でPNG形式でエクスポートし、Word文書やプレゼンテーションで使用する方法
  • アセットライブラリ用に、ブランドロゴのPNGバージョンを複数のサイズで生成する
  • ブラウザのタブとブックマークに表示するSVGアイコンからPNGファビコンを作成する

ウェブ&アプリ開発

  • インラインSVGをサポートしていない環境向けにSVGアイコンをPNGに変換する
  • SVGイラストをPNG形式でエクスポートして、React NativeまたはFlutterアプリで使用する
  • SVGテンプレートから正確な1200×630ピクセルの寸法でOpen Graphプレビュー画像を生成する

デザイン&印刷

  • ベクター画像のアップロードに対応していないプラットフォーム向けに、SVGアートワークをPNGにラスタライズする。
  • FigmaまたはIllustratorのSVGエクスポートをPNGに変換してクライアントに納品する
  • SVGベースのインフォグラフィックをPNG形式に変換し、メールニュースレターに埋め込む準備

SVGをPNGに変換する方法

1

ドロップゾーンをクリックするか、ファイルマネージャーからドラッグ&ドロップして、SVGファイルをアップロードしてください。複数のSVGファイルを一度にドロップすれば、アイコンライブラリ全体やブランドアセットコレクションからPNG画像を一括エクスポートできます。ラスタライズ処理はすべてブラウザ上でローカルに実行され、ファイルはサーバーにアップロードされません。

2

PNG出力の幅と高さを希望どおりに設定するか、SVGの元の寸法を維持してください。SVGは解像度に依存しないため、ファビコン用の32ピクセル、アプリのアイコン用の512ピクセル、印刷用アセット用の4000ピクセルなど、同じファイルを様々なサイズでエクスポートできます。いずれの場合も、画質の劣化なく、完璧な鮮明さを維持できます。

3

選択した解像度で、鮮明な透明背景のPNGファイルをダウンロードできます。SVGファイルの背景はデフォルトで透明になっており、コンバーターをこのアルファチャンネルをPNG出力でも保持します。複数のSVGファイルを一括変換する場合は、すべてのPNGファイルがZIPアーカイブにパッケージ化され、ワンクリックでダウンロードできます。

SVGとPNG :何が変わるのか

SVGとPNGの違いを理解することで、ニーズに合った適切なフォーマットを選択できます。

仕様SVGPNG
圧縮なし(テキストベース)ロスレス
品質完璧(ベクター)素晴らしい
透明性はいはい
アニメーションはいいいえ
ファイルサイズグラフィック用としては非常に小さい中~大

SVGから変換理由は何ですか?

  • 写真撮影には適していません
  • 複雑な画像は非常に大きなファイルを生成します
  • 埋め込みスクリプトによる潜在的なセキュリティリスク

PNGを選ぶ理由は何ですか?

  • ロスレス圧縮は品質を維持します
  • 完全な透明性のサポート
  • グラフィックとテキストに最適

SVGを使用するタイミング

ロゴ、アイコン、イラストなど、あらゆる解像度で鮮明に表示されるスケーラブルなグラフィックが必要な場合。

PNGを使用するタイミング

透明性、ロスレス品質、またはグラフィックやロゴを扱う必要がある場合。

SVGからPNGへの変換 — よくある質問

SVGベクターグラフィックをPNGに変換することに関する技術的および実践的な回答。

SVGをPNGにエクスポートする際、どの解像度を選択すればよいですか?

用途によって異なります。Webアイコンの場合は32~512ピクセル、ソーシャルメディアのプロフィール画像の場合は800×800ピクセル以上を使用してください。300 DPIで印刷する場合は、印刷したいインチ数を300倍してください(A4サイズの場合は約2480×3508ピクセル)。Retina/HiDPIスクリーンの場合は、表示したいサイズの2倍でエクスポートしてください。

SVGファイル内のテキストとフォントは、PNGファイルで正しく表示されますか?

SVG内のテキストは、システムフォントを使用するテキスト(レンダリングデバイスにインストールされている必要があります)と、パスに変換されたテキスト(常に正しくレンダリングされます)の2種類に分類されます。SVGでシステムフォントではない埋め込みフォントやWebフォントを使用する場合は、正確性を確保するために、エクスポートする前にデザインツールでテキストを変換。

エクスポートしたPNG画像が、ブラウザで表示されるSVG画像と異なって見えるのはなぜですか?

SVGのレンダリングはエンジンによって異なる場合があります。CSSフィルター、ブレンドモード、複雑なクリップパスは、ブラウザと当社のラスタライザー間で若干異なる場合があります。重要なブランドアセットについては、必ずPNG出力を校正し、必要に応じてソースSVGを調整してください。

透明な背景を持つSVGファイルをPNGファイルに変換できますか?

はい。SVGファイルはデフォルトで背景が透明になっており、弊社のコンバーターをフルアルファチャンネルを使用してPNG出力でもこの透明度を維持します。SVGファイルに白または色の付いた長方形の背景が明示的に含まれている場合、それもPNGファイルに含まれます。透明度が必要な場合は、SVGエディタでその長方形を削除してください。

SVGファイルのアップロードにはファイルサイズ制限がありますか?

当社では最大10MBまでのSVGファイルを受け付けています。ほとんどのSVGファイルはこれよりもはるかに小さく、数千ものパスを含む複雑なイラストでも通常は1MBをはるかに下回ります。非常に大きなSVGファイルは、高解像度での出力時にラスタライズに時間がかかる場合がありますが、ほとんどの場合は2秒以内に変換。

変換したPNGファイルを商用利用してもいいですか?

当社の変換ツールは、出力されたPNGファイルの使用方法に制限を設けていません。商用利用も完全に許可されています。ただし、元のSVGアートワークの著作権は作成者に帰属します。当社のツールの出力ライセンスは変換プロセス自体のみを対象とし、基となるデザインは対象外です。