> For the complete documentation index, see [llms.txt](https://codalin.gitbook.io/nodalin-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://codalin.gitbook.io/nodalin-docs/nodes-reference/sources/line.md).

# Line

<table data-header-hidden><thead><tr><th width="141.6597900390625"></th><th></th></tr></thead><tbody><tr><td><div><figure><img src="https://937151318-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F44MuVIHBk5o5yfcGn64w%2Fuploads%2FZ6QreVPUHBzRSZVVfW3o%2Fimage.png?alt=media&amp;token=2b43a23d-ff84-4b49-8f85-e29f24a51285" alt="" width="76"><figcaption></figcaption></figure></div></td><td>Renders a line segment with customizable length, position, rotation, color, and width. Can be defined by two points or by length and rotation. Its two endpoints can be used to create <a href="/nodalin-docs/how-to.../instancing.md">instancing</a> groups of other shapes.</td></tr></tbody></table>

<table><thead><tr><th width="154.94140625">Property name</th><th width="405.4765625">Description</th><th>Compatible datatype</th></tr></thead><tbody><tr><td>length</td><td>Length of the line</td><td>number</td></tr><tr><td>start</td><td>Coordinates of the first vertex</td><td>point</td></tr><tr><td>end</td><td>Coordinates of the second vertex</td><td>point</td></tr><tr><td>x</td><td>Horizontal position</td><td>number</td></tr><tr><td>y</td><td>Vertical position</td><td>number</td></tr><tr><td>rot</td><td>Rotation</td><td>number</td></tr><tr><td>color</td><td>Line color</td><td>color</td></tr><tr><td>strokeWidth</td><td>Line width</td><td>number</td></tr><tr><td>origin</td><td>Center point of the shape. Defaults to (0, 0). Changing it moves the shape’s pivot without affecting its x and y position.</td><td>point</td></tr><tr><td>zindex</td><td>Controls which element appears on top when elements overlap; higher values sit above lower ones.</td><td>number</td></tr><tr><td>instance</td><td>Instancing target</td><td>figure</td></tr><tr><td>instanceIndex</td><td>Displays the instance with the given index number</td><td>number</td></tr></tbody></table>

{% hint style="info" %}

* When both `start` and `end` properties are used to define a line, the `x`, `y`, `length` and `rot` properties are ignored.
* The `strokeWidth` property is available when a Color node is connected to the `outline`
* The `zindex` increases automatically, unless there's a connection to it.
* The `instanceIndex` property is available when a Source node is connected as an instancing target. Instancing index value cycles back when the provided value exceeds the available number of instances.&#x20;
  {% endhint %}

### Example Projects

[**Pixel Visuala**](https://app.nodalin.xyz/project/4d00d923-79c8-497b-8c26-488db5c86ea5)\
There are a lot going on this project. Have a closer look to the bottom-right corner of the graph and you'll notice that there are 2 Point nodes connected to the Line node. This makes it possible to keep the start of the pink line going around in circles while the end of the line is matching the position of the green glowing elements as they are being generated.

<div data-with-frame="true"><figure><img src="https://937151318-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F44MuVIHBk5o5yfcGn64w%2Fuploads%2FAHBBPzkt8T9qnNu3oJgy%2Fimage.png?alt=media&amp;token=1908b4de-bce7-45ff-adf8-21580d39bb9c" alt="" width="375"><figcaption></figcaption></figure></div>