Lines in SVG: <line>

Defining lines in svg:

<svg xmlns="http://www.w3.org/2000/svg"
    viewBox="0 0 1000 200">

  <line stroke-width="4" stroke="#E4AF4C"
      x1="300" x2="650"
      y1="150" y2="60" />

</svg>

Breaking it down

Here are the properties used to define lines:

  • x1 & y1: The x and y position of the first point of the line.
  • x2 & y2: The x and y position of the second point of the line.
✖ Clear

🕵 Search Results

🔎 Searching...