SVGView

SVG回転&反転ツール

編集ツールを使用せずに方向と方向をすばやく修正します。アイコン、矢印、UI アセットに最適です。 SVG ファイルを開いてすぐに処理できます。

SVG が未読み込みです。ファイルをドロップして開始してください。

SVG エディターへようこそ

SVG をドロップするか「アップロード/アイコン」をクリック、または Ctrl/Cmd+V で SVG コードを貼り付け

サンプルアイコンから開始

下のサンプルを選ぶか、ご自身の SVG をアップロードして編集できます。

SVG 回転＆反転ツールを使用する理由

クイックアングル回転

SVG 回転では、ワンクリックで一般的な角度を回転できるため、方向をすばやく調整できます。これにより、エッジが鮮明に保たれ、コード内の手動変換が回避されます。これを使用して、タブ、ナビゲーション、またはミラーリングされた UI 状態のアイコンを配置します。

水平方向と垂直方向の反転

このツールは、UI 方向の変更、RTL レイアウト、またはアイコンのバリエーションのアートワークを反映します。反転は正確で、元のプロポーションがそのまま維持されます。これは、再描画せずに左右のバリアントが必要な場合に役立ちます。

ライブプレビュー

SVG Rotate は更新を即座に表示するため、エクスポートする前に間隔と配置を確認できます。プレビューにより、本番環境での予期せぬ事態が防止され、レビューが迅速に行われます。コントラストのある背景を使用して、はみ出したストロークやパディングを見つけます。

SVG または PNG をエクスポート

SVG Rotate を使用すると、変換された SVG をダウンロードしたり、ドキュメントやスライド用の PNG をエクスポートしたりできます。これは、ラスターのフォールバックを迅速に行う必要がある場合に便利です。 PNG エクスポートは、プラットフォームが SVG をサポートしていない場合にも役立ちます。チームが適切なファイルを選択できるように、両方の形式を一緒に保管してください。

ViewBox に適した出力

SVG Rotate は viewBox を保持または調整するため、変換後もスケーリングが正しく維持されます。これにより、CSS と HTML でのレイアウトが安定します。 viewBox を適切に処理すると、予期しないクリッピングも減少します。ファイルに viewBox がない場合は、回転する前に viewBox を追加してください。

ローカルのプライベート処理

SVG Rotate はアップロードせずにブラウザ内で完全に実行されます。クライアント資産を安全に保ち、制限されたネットワークでも動作します。ローカル処理により、大きなファイルの反復処理も高速に行われます。

SVG を回転または反転する方法

1

SVG を追加する

ファイルをドラッグ アンド ドロップするか、SVG マークアップを貼り付けます。 SVG Rotate はソースをローカルにロードし、元の viewBox をそのまま保持します。最も予測可能な結果を​​得るには、アートワークが中央に配置されていることを確認してください。 SVG ファイルを開いてすぐに処理できます。

2

回転または反転

回転角度または反転方向を選択すると、プレビューが即座に更新されるのを確認できます。 SVG Rotate は形状を整列させて出力を鮮明に保ちます。余分なパディングが表示される場合は、ソースの viewBox を調整します。

3

結果のエクスポート

変換された SVG をダウンロードするか、ワンクリックで PNG をエクスポートします。 SVG Rotate はファイル名を整然と保ち、素早い受け渡しを可能にします。バリアントには、icon-arrow-right.svg のような一貫した名前を使用します。

SVG の回転と反転に関するよくある質問

SVG をオンラインで回転するにはどうすればよいですか?
ファイルをアップロードし、回転角度を選択すると、SVG Rotate が即座にそれを適用します。エクスポート前にプレビューで方向を確認できます。これにより、CSS またはスクリプトでの手動変換計算が回避されます。
SVG をオンラインで水平または垂直に反転できますか?
はい。 SVG Rotate には両方向の反転コントロールが含まれており、ミラーリングされたアイコンや方向性のある UI 要素に役立ちます。 RTL 対応のアセットが必要な場合にも役立ちます。
SVG を回転すると viewBox が変更されますか?
SVG Rotate は、変換されたグラフィックが正しく拡大縮小されるように viewBox を保持または調整します。これにより、レイアウト内のクリッピングが防止されます。透明な背景チェックで確認できます。
回転させた後にPNGをエクスポートできますか?
はい。 SVG Rotate には、ドキュメントやプレゼンテーション用に簡単なラスター バージョンが必要な場合に備えて、PNG エクスポート オプションが含まれています。 PNG は、SVG をサポートしていないチャット ツールに便利です。
私のSVGはアップロードされていますか?
いいえ。SVG Rotate はブラウザ内でローカルに実行されるため、ファイルがデバイスから外部に流出することはありません。これにより、クライアントの作業の機密性が保たれます。
ファイルサイズの制限はどれくらいですか?
SVG Rotate は最大 10MB のファイルをサポートします。大規模または複雑な SVG のレンダリングには時間がかかる場合があります。パスを単純化すると、プレビューを高速化できます。重いフィルターを削除すると、パフォーマンスも向上します。
カラーとストロークは保持されますか?
このツールは塗りつぶし、ストローク、ID をそのまま維持するため、視覚的な出力は変換後のオリジナルと一致します。これはブランドアイコンにとって重要です。グラデーションとマスクも保持します。
SVG 回転＆反転ツールはダウンロードせずに無料で使用できますか?
はい。 SVG 回転＆反転ツールはブラウザで無料で使用できます。ダウンロードやインストールは必要ありません。
SVG 回転&反転ツールを使用するにはアカウントが必要ですか?
いいえ、SVG 回転&反転ツールはサインアップしなくてもブラウザで即座に動作し、ファイルはローカルに残ります。

関連する SVG ツール

SVG Rotate をこれらのツールと組み合わせて、一貫したアセットのサイズ変更、最適化、エクスポートを行います。これらのヘルパーは、サイズや方向を問わずアセットの一貫性を保ちます。

SVG リサイズ

SVG 回転後にアセットのサイズを変更し、寸法がレイアウト グリッドと一致するようにします。これにより、アイコン セット間で間隔の一貫性が保たれます。

ツールを開く

SVG オプティマイザー

出力を軽量に保つために、SVG 回転後のファイル サイズを削減します。最適化により、エディターのメタデータも削除されます。これは、アセットを Web バンドルで配布するときに役立ちます。

ツールを開く

SVG ビューア

SVG 回転の前後でアセットをプレビューして位置合わせを確認します。背景を切り替えて透明度を確認します。ズームを使用してピクセルのエッジを検査します。

ツールを開く

SVG から PNG

ラスター フォールバックが必要な場合は、SVG 回転結果と一緒に PNG をエクスポートします。これは、スライド内のアセットを共有するときに役立ちます。わかりやすくするために、PNG には同じ方向の名前を付けてください。

ツールを開く