# yqnn/svg-path-editor

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/yqnn-svg-path-editor).**

_How this analysis was created: the description and tags below were written by an AI model that read this project's README and public documentation pages; stars, license and language come straight from the GitHub API. The model does not read the source code._

5,222 stars · 419 forks · TypeScript · Apache-2.0

## Links

- GitHub: https://github.com/Yqnn/svg-path-editor
- Homepage: https://yqnn.github.io/svg-path-editor/
- awesome-repositories: https://awesome-repositories.com/repository/yqnn-svg-path-editor.md

## Topics

`svg` `svg-editor` `svg-parser` `svg-path`

## Description

This project is a vector path manipulator and SVG geometry transformer that provides a visual interface for modifying SVG path data. It serves as a utility for adding, removing, and converting path segments without writing coordinate code by hand.

The tool functions as an SVG path optimizer, reducing path data length and cleaning up coordinate systems. It also includes a geometry transformer for applying scaling, rotation, and translation to vector shapes.

The software includes capabilities for visual path manipulation and global geometry transformations. It also provides viewport control tools for zooming, panning, and fitting the view to the current path.

## Tags

### Graphics & Multimedia

- [SVG Path Manipulation Toolkits](https://awesome-repositories.com/f/graphics-multimedia/svg-path-manipulation-toolkits.md) — Provides a comprehensive visual toolkit for splitting, merging, and transforming SVG path data.
- [SVG Geometry Transformations](https://awesome-repositories.com/f/graphics-multimedia/2d-vector-geometries/svg-geometry-transformations.md) — Applies scaling, rotating, and translation to vector paths to refine layout and alignment.
- [SVG Geometry Transformers](https://awesome-repositories.com/f/graphics-multimedia/2d-vector-geometries/svg-geometry-transformers.md) — Provides a browser-based tool for scaling, rotating, and translating vector shapes.
- [Bézier Curve Interpolations](https://awesome-repositories.com/f/graphics-multimedia/bezier-curve-interpolations.md) — Calculates curved line positions between control points using cubic and quadratic Bézier formulas.
- [Geometric Path Transformations](https://awesome-repositories.com/f/graphics-multimedia/coordinate-based-vector-processing/svg-path-calculations/geometric-path-transformations.md) — Modifies vector path geometry using transformation matrices for scaling and rotation.
- [SVG Path Command Mappings](https://awesome-repositories.com/f/graphics-multimedia/svg-path-command-mappings.md) — Maps SVG path command strings to interactive coordinate objects for direct graphical manipulation.
- [SVG Path Geometry Transformations](https://awesome-repositories.com/f/graphics-multimedia/svg-path-rendering/svg-path-geometry-transformations.md) — Applies global scaling, rotation, and translation to refine the overall shape of an SVG path. ([source](https://cdn.jsdelivr.net/gh/yqnn/svg-path-editor@master/README.md))
- [Path Optimizations](https://awesome-repositories.com/f/graphics-multimedia/svg-text-and-path-processing/path-optimizations.md) — Reduces vector path complexity by removing redundant nodes and simplifying coordinate systems.
- [Vector Path Optimizations](https://awesome-repositories.com/f/graphics-multimedia/vector-path-optimizations.md) — Reduces path complexity by cleaning up coordinate systems and removing redundant data.
- [Screen Space Coordinate Mappings](https://awesome-repositories.com/f/graphics-multimedia/visualization-mapping/visualization-frameworks/coordinate-systems/page-coordinate-mapping/screen-space-coordinate-mappings.md) — Translates virtual Cartesian vector coordinates to physical screen pixels and back for rendering and saving.
- [Canvas Vector Rendering](https://awesome-repositories.com/f/graphics-multimedia/canvas-vector-rendering.md) — Implements high-performance drawing of vector paths using the HTML5 canvas API for the workspace.
- [SVG Illustration Design](https://awesome-repositories.com/f/graphics-multimedia/svg-illustration-design.md) — Provides a visual interface for designing precise vector shapes and lines for web-based illustrations.
- [SVG Path Serializers](https://awesome-repositories.com/f/graphics-multimedia/svg-path-serializers.md) — Converts optimized geometric data back into clean SVG path data strings. ([source](https://cdn.jsdelivr.net/gh/yqnn/svg-path-editor@master/README.md))

### Programming Languages & Runtimes

- [SVG Path String Splitters](https://awesome-repositories.com/f/programming-languages-runtimes/string-splitting/svg-path-string-splitters.md) — Deconstructs SVG path strings into structured arrays of segments for granular editing.