Creates a marker element that can be used to define graphical objects that can be used repeatedly in a drawing, such as arrowheads or other markers on paths.

DOM object: SVGMarkerElement
SVG2 spec: https://www.w3.org/TR/SVG2/painting.html#MarkerElement

A <marker> is a reusable mini-graphic that SVG automatically stamps at the vertices of a path or other shape — the classic example is an arrowhead at the end of a line. You define the marker's geometry once (typically inside "<defs>"), give it an id, and then attach it to a shape through the marker-start, marker-mid, or marker-end CSS properties (or the shorthand marker). SVG draws one copy of the marker at each relevant vertex, automatically rotating it to follow the path's direction when orient="auto".

Use <marker> for arrowheads on connectors, dots or ticks at polyline vertices, direction indicators on graph edges, and similar repeated vertex decorations.

<marker id="arrow" refX="3" refY="3" markerWidth="6" markerHeight="6" orient="auto">
  <path d="M 0 0 L 6 3 L 0 6 z" fill="red" />
</marker>

Attribute	Default	Description
viewBox	(none)	A list of four numbers (min-x, min-y, width, height) separated by whitespace and/or a comma, that specify a rectangle in userspace that should be mapped to the SVG viewport bounds established by the marker.
preserveAspectRatio	xMidYMid meet	How to scale the viewport to fit the content. Only applies is viewBox is specified.
markerWidth	3	Width of the marker viewport.
markerHeight	3	Height of the marker viewport.
refX	0	X coordinate for the reference point of the marker, where the marker is centered.
refY	0	Y coordinate for the reference point of the marker, where the marker is centered.
orient	0	Orientation of the marker relative to the path. Supported values: auto, auto-start-reverse, or an angle for a fixed rotation such as 45deg or 3.14rad.