SVGを作成する場合、Illustratorなどのドローアプリケーションを使ってSVG形式でエクスポートするのではないでしょうか。SVGを直接作成、編集できるソフトウェアはあまりないように思います。 そこで使ってみたいのがSvgPathEditorです。SVGをWebブラウザ上で作成、編集できるソフトウェアです。

SvgPathEditorの使い方

メイン画面です。

マウスでドラッグして編集できます。

パスの追加や描画の種類を変更できます。

プレビューです。

コマンド一覧から、描画している範囲を可視化できます。

保存機能もあります。

SvgPathEditorを使えばSVGをWebブラウザ上で手軽に加工できます。最初はドローアプリケーションでもいいですが、その後のちょっとした編集はSvgPathEditorで行えるのが便利です。また、JavaScriptと連携させたい時の動作確認などにも使えそうです。

SvgPathEditorはTypeScript製のオープンソース・ソフトウェア(Apache Licnese 2.0)です。

SvgPathEditor Yqnn/svg-path-editor: Online editor to create and manipulate SVG paths