SVGPathElement - Web APIs | MDN

Toggle sidebar

Theme

OS default
Light
Dark

English (US)

Remember language Learn more

SVGPathElement

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

* Some parts of this feature may have varying levels of support.

The SVGPathElement interface corresponds to the <path> element.

EventTarget Node Element SVGElement SVGGraphicsElement SVGGeometryElement SVGPathElement

Note: In SVG 2 the getPathSegAtLength() and createSVGPathSeg* methods were removed and the pathLength property and the getTotalLength() and getPointAtLength() methods were moved to SVGGeometryElement.

Instance properties

This interface inherits properties from its parent, SVGGeometryElement.

SVGPathElement.pathLength Read only

This property reflects the pathLength attribute.

Instance methods

This interface also inherits methods from its parent, SVGGeometryElement.

SVGPathElement.getPathData()

Returns the sequence of path segments that corresponds to the path data, optionally normalizing the values and segment types.

SVGPathElement.getPointAtLength()

Returns the point at a given distance along the path.

SVGPathElement.getTotalLength()

Returns the user agent's computed value for the total length of the path in user units.

SVGPathElement.setPathData()

Sets the sequence of path segments as the new path data.

SVGPathElement.getPathSegmentAtLength()

Returns the segment at a given distance along the path.

Deprecated methods

SVGPathElement.getPathSegAtLength()

Returns an unsigned long representing the index within the pathSegList utilizing the user agent's distance-along-a-path algorithm.

SVGPathElement.createSVGPathSegClosePath()

Returns a stand-alone, parentless SVGPathSegClosePath object.

SVGPathElement.createSVGPathSegMovetoAbs()

Returns a stand-alone, parentless SVGPathSegMovetoAbs object.

SVGPathElement.createSVGPathSegMovetoRel()

Returns a stand-alone, parentless SVGPathSegMovetoRel object.

SVGPathElement.createSVGPathSegLinetoAbs()

Returns a stand-alone, parentless SVGPathSegLinetoAbs object.

SVGPathElement.createSVGPathSegLinetoRel()

Returns a stand-alone, parentless SVGPathSegLinetoRel object.

SVGPathElement.createSVGPathSegCurvetoCubicAbs()

Returns a stand-alone, parentless SVGPathSegCurvetoCubicAbs object.

SVGPathElement.createSVGPathSegCurvetoCubicRel()

Returns a stand-alone, parentless SVGPathSegCurvetoCubicRel object.

SVGPathElement.createSVGPathSegCurvetoQuadraticAbs()

Returns a stand-alone, parentless SVGPathSegCurvetoQuadraticAbs object.

SVGPathElement.createSVGPathSegCurvetoQuadraticRel()

Returns a stand-alone, parentless SVGPathSegCurvetoQuadraticRel object.

SVGPathElement.createSVGPathSegArcAbs()

Returns a stand-alone, parentless SVGPathSegArcAbs object.

SVGPathElement.createSVGPathSegArcRel()

Returns a stand-alone, parentless SVGPathSegArcRel object.

SVGPathElement.createSVGPathSegLinetoHorizontalAbs()

Returns a stand-alone, parentless SVGPathSegLinetoHorizontalAbs object.

SVGPathElement.createSVGPathSegLinetoHorizontalRel()

Returns a stand-alone, parentless SVGPathSegLinetoHorizontalRel object.

SVGPathElement.createSVGPathSegLinetoVerticalAbs()

Returns a stand-alone, parentless SVGPathSegLinetoVerticalAbs object.

SVGPathElement.createSVGPathSegLinetoVerticalRel()

Returns a stand-alone, parentless SVGPathSegLinetoVerticalRel object.

SVGPathElement.createSVGPathSegCurvetoCubicSmoothAbs()

Returns a stand-alone, parentless SVGPathSegCurvetoCubicSmoothAbs object.

SVGPathElement.createSVGPathSegCurvetoCubicSmoothRel()

Returns a stand-alone, parentless SVGPathSegCurvetoCubicSmoothRel object.

SVGPathElement.createSVGPathSegCurvetoQuadraticSmoothAbs()

Returns a stand-alone, parentless SVGPathSegCurvetoQuadraticSmoothAbs object.

SVGPathElement.createSVGPathSegCurvetoQuadraticSmoothRel()

Returns a stand-alone, parentless SVGPathSegCurvetoQuadraticSmoothRel object.

Specifications

Specification

Scalable Vector Graphics (SVG) 2
# InterfaceSVGPathElement

Browser compatibility

Enable JavaScript to view this browser compatibility table.

Help improve MDN

Was this page helpful to you?

Yes No

Learn how to contribute

This page was last modified on May 9, 2026 by MDN contributors.

View this page on GitHub • Report a problem with this content