"<line>"

Creates a line between two points, using the x1, y1, x2, and y2 attributes.

• DOM object: SVGLineElement
• SVG2 spec: https://www.w3.org/TR/SVG2/shapes.html#LineElement

The <line> element draws a single straight-line segment from one point (x1, y1) to another (x2, y2). Because a line has no interior, only the stroke attribute is visible — setting fill on a <line> has no effect. For multi-segment open paths use "<polyline>", and for closed multi-point shapes use "<polygon>". Arrowheads and other end decorations can be attached via the marker-start / marker-end CSS properties and a "<marker>" definition.

Use <line> for rulers, axes, dividers, connectors between diagram nodes, or any simple one-segment stroke.

<line x1="100" y1="100" x2="200" y2="200" stroke="black" stroke-width="2" />

Attribute	Default	Description
x1	0	Start X coordinate.
y1	0	Start Y coordinate.
x2	0	End X coordinate.
y2	0	End Y coordinate.