SVG図形ジェネレーター

無料のオンラインSVG図形ジェネレーター。長方形、円、楕円、線、多角形、パスをビジュアルエディタで作成。塗り、ストローク、不透明度、ジオメトリをリアルタイムに編集。SVGコードをコピーまたはファイルをダウンロード。

プレビュー
図形タイプ
X位置 / Y位置
50
50
幅 / 高さ
200
150
塗り色
線色
線の幅
2
不透明度
100%
プリセットテンプレート
SVGコード
 

SVG図形ジェネレーターについて

SVG(Scalable Vector Graphics)は、あらゆるサイズに完璧に拡大縮小しても品質を失わないベクター画像形式です。ラスター画像(PNG、JPEG)とは異なり、SVGは数学的なパスと図形で定義されるため、ロゴ、アイコン、イラスト、レスポンシブWebグラフィックスに最適です。このツールを使えば、コードを書かずにビジュアル的にSVGグラフィックスを作成できます。

機能

よくある質問

SVGとは何ですか、なぜ使用すべきですか?

SVGはScalable Vector Graphicsの略です。拡大するとピクセル化するPNGやJPEGとは異なり、SVGグラフィックスは数学的なパスで定義されるため、あらゆるサイズで鮮明なままです。Webサイトのロゴ、アイコン、チャート、イラストに最適です。また、シンプルなグラフィックスではファイルサイズも小さく、CSSでスタイル設定できます。

生成されたSVGはプロジェクトで使用できますか?

はい。このツールで作成されたすべてのSVGは、個人および商用プロジェクトで自由に使用できます。生成されたコードは、Chrome、Firefox、Safari、Edgeなどのすべてのモダンブラウザ、およびデザインツール(Figma、Adobe Illustrator)とコンテンツ管理システムで動作する標準SVGです。

1つのSVGに複数の図形を追加するにはどうすればよいですか?

「図形を追加」ボタンを使用して、キャンバスに複数の図形を追加できます。各図形は独自の塗り、線、ジオメトリプロパティを持つことができます。最終的なSVG出力には、すべての図形が1つのファイルに含まれます。

SVGはすべてのブラウザで動作しますか?

はい。このツールは、Chrome、Firefox、Safari、Edge、モバイルブラウザを含むすべてのモダンブラウザでサポートされている標準SVG 1.1マークアップを生成します。SVGはW3C標準であり、10年以上ブラウザでサポートされています。