正確な出力サイズを選択
エクスポート前にピクセル寸法を設定して、ラスター化されたグラフィックが必要なサイズでシャープに配置されるようにします。
SVG ファイルをドラッグ&ドロップし、出力サイズとフォーマットを選択して、数秒でシャープなピクセル画像をダウンロード。すべてデバイス上で実行 — サインアップ不要、アップロード不要、ウォーターマークなし。
変換する SVG ファイルをドラッグ&ドロップ
SVG · 最大50ファイル · ファイルあたり 100 MB
SVG はベクター形式です。つまり、ロゴやアイコンがピクセルの格子ではなく数式として保存されます。だからこそ、どのサイズでも鮮明に保たれ、デザイナーがブランドマークやインターフェースグラフィックスに使い続けるのです。ただし問題はデザインツールを離れた途端に現れます。メールクライアントは SVG を削除し、ほとんどのマーケットプレイスは拒否し、多くのコンテンツシステムはアップロードを拒み、オフィスアプリケーションは無視し、ソーシャルプラットフォームはレンダリングすらしません。これらの場所すべてが求めているのは、どこにでも表示できる固定ピクセルのラスター画像です。
このページはそのギャップを埋めます。SVG を変換するとラスター化されます。つまり、ブラウザが選択したサイズでベクターアートワークを実際のピクセルにレンダリングし、標準的な画像ファイルを提供します。ロゴがどの色の背景にもきれいに配置されるように、グラフィックが透明背景を保つ必要がある場合は PNG に送信します。フラットな写真風のファイルが必要で、アートワークの背後に単色を配置できる場合は JPG に送信します。より小さなウェブ対応の結果が必要な場合は、WebP も利用できます。
ラスター化はアートワークをピクセル数に固定するため、出力サイズが最も重要な決定であり、エクスポート前にエディターで設定します。大きく表示されるものには寛容なサイズを選択し、高 DPI スクリーンに向かうグラフィックは鮮明さを保つために 2 倍でエクスポートします。1 つの SVG をドラッグ&ドロップするとデバイスに直接保存され、バッチをドロップするとすべてが整理された ZIP として返されます。何もアップロードされません。レンダリングとエンコーディングはすべてブラウザ内の WebAssembly で実行されます。
エクスポート前にピクセル寸法を設定して、ラスター化されたグラフィックが必要なサイズでシャープに配置されるようにします。
PNG でアルファチャンネルを保持するか、JPG で単色に平坦化します。WebP やその他のフォーマットも利用できます。
ベクターがブラウザ内でピクセルに描画されます。変換中にネットワークタブを監視すると、何も送信されていないことが確認できます。
メールクライアントは SVG を完全に無視します。マークを透明な PNG にラスター化して、すべてのインボックスで固定サイズでレンダリングされるようにします。
ストアフロントはラスターアップロードを望んでおり、多くは白い JPG です。SVG を単色背景にフラット化すると検証が完了します。
プレゼンテーションアプリは SVG よりも PNG をはるかに確実に処理します。大きなサイズでエクスポートして、アイコンが画面上で鮮明に保たれるようにします。
ソーシャルプラットフォームはフラット画像が必要です。SVG をネットワークが期待する正確なサイズにラスター化して、手間なく投稿します。
多くのツールは特定のサイズの正方形 PNG を要求します。生の SVG を送信する代わりに、ベクターをそれらのピクセルにレンダリングします。
最大 50 個の SVG をサイズとフォーマットを共有する 1 回のパスで変換し、すべてを 1 つの ZIP として取得します。
1 つのアイコンまたは 50 個のバッチを追加します。調整するまで、それぞれが同じ出力設定を共有するキューに参加します。
ピクセル寸法を選択し、PNG、JPG、WebP、または別の出力を選択します。JPG の場合は、背景色も選択します。
1 つのグラフィックは単独で保存されます。バッチは新しい拡張子にすべてのファイルを名前変更して 1 つの ZIP としてダウンロードされます。
まず出力サイズを決定します。ラスター化するとアートワークがそのピクセル数に固定され、後で正常にスケールアップできません。
Retina および他の高 DPI スクリーン用にディスプレイサイズの 2 倍でエクスポートして、エッジが柔らかいのではなく鮮明に保たれるようにします。
グラフィックが透明性を必要とする場合は PNG を使用します。JPG にはアルファがないため、常に空の領域を色で埋めます。
JPG の場合は、画像が配置される場所に合わせた塗りつぶし色を選択して、フラット化された背景がなじむようにします。