marker-end

Baseline Widely available

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

The marker-end attribute defines the arrowhead or polymarker that will be drawn at the final vertex of the given shape.

For all shape elements, except <polyline> and <path>, the last vertex is the same as the first vertex. In this case, if the value of marker-start and marker-end are both not none, then two markers will be rendered on that final vertex. For <path> elements, for each closed subpath, the last vertex is the same as the first vertex. marker-end is only rendered on the final vertex of the path data.

Note: As a presentation attribute, marker-end also has a CSS property counterpart: marker-end. When both are specified, the CSS property takes priority.

You can use this attribute with the following SVG elements:

Example

Usage notes

Value	`none` \| `<marker-ref>`
Default value	`none`
Animatable	discrete

none: Indicates that no marker symbol shall be drawn at the final vertex.
<marker-ref>: This value is a reference to a <marker> element, which will be drawn at the final vertex. If the reference is not valid, then no marker will be drawn.