<trace />
Overview
The <trace /> element represents an electrical connection between two or more points in your circuit. Traces can connect components, nets, or specific pins on components.
Basic Usage
Here's a simple example connecting two components:
Trace Properties
| Property | Description | Example |
|---|---|---|
from | Starting point of the trace using a port selector | ".R1 > .pin1" |
to | Ending point of the trace using a port selector | ".C1 > .pin1" |
name | Names the trace and renders as the schematic net label for direct port-to-port traces (optional) | "SENSE" |
maxLength | Maximum length the trace can be (optional) | "10mm" |
minLength | Minimum length the trace must be (optional) | "5mm" |
width | Width of the trace (optional) | "0.2mm" |
thickness | Same as width; sets the copper width for the trace (optional) | "0.2mm" |
pcbPath | Array of points defining a manual PCB path relative to an anchor port | [{ x: 1, y: 0 }, { x: 1, y: 1 }] |
pcbTeardrops | Enable automatic PCB teardrops | true |
pcbTeardropStart | Teardrop at the start (from) of trace | true |
pcbTeardropEnd | Teardrop at the end (to) of trace | false |
pcbPathRelativeTo | Port selector that pcbPath coordinates are relative to (defaults to the from port) | ".R1 > .pin2" |
PCB teardrops
Set pcbTeardrops to widen traces at pad and via contacts after routing.
Use pcbTeardropStart and pcbTeardropEnd to override the from and to
endpoints. Omitted endpoint settings inherit pcbTeardrops.
This example adds a teardrop at R1 while leaving the C1 end unchanged:
export default () => (
<board width="16mm" height="10mm">
<resistor name="R1" resistance="100" footprint="0603" pcbX={-3} />
<capacitor name="C1" capacitance="10nF" footprint="0603" pcbX={3} />
<trace
from="R1.2"
to="C1.1"
thickness="0.2mm"
pcbPath={[]}
pcbTeardrops
pcbTeardropEnd={false}
/>
</board>
)
Connecting to Nets
Traces can connect to named nets like power and ground:
Trace Net Labels
Use name when you want a direct port-to-port trace to show a specific net label in the schematic.
Autorouting
Traces are automatically routed by tscircuit's autorouting system. The autorouter will:
- Find a path between components that doesn't intersect other traces
- Use vias to change layers when needed
- Respect any length constraints specified
- Try to minimize the number of vias used
You can customize the autorouting behavior by setting the autorouter property on the parent <board /> or <subcircuit />.
Manual PCB Paths
Sometimes you may want to manually specify the exact path a trace should take on the PCB. Provide a list of points with pcbPath to override autorouting and draw the route yourself. The coordinates are relative to a specific port defined by pcbPathRelativeTo (defaults to the from port). Entries in pcbPath can mix coordinate objects with port selectors so you can anchor the path to specific component pins.
export default () => (
<board width="20mm" height="10mm">
<resistor name="R1" resistance="10k" footprint="0402" pcbX={-3} />
<resistor name="R2" resistance="10k" footprint="0402" pcbX={3} />
<trace
from="R1.pin2"
to="R2.pin1"
pcbPathRelativeTo="R1.pin2"
pcbPath={["R1.pin2", { x: 0, y: 4 }, "R2.pin1"]}
/>
</board>
)
Length Constraints
Sometimes you need traces to be exactly a certain length, like for high-speed signals. You can use maxLength and minLength:
Differential Pairs
For high-speed signals, use a <differentialpair />
to identify two traces and constrain their routed-length skew. Connections can
refer to the traces by name or by a specific pin selector.
<trace
name="USB_DP"
from=".J1 > .USB_DP"
to=".TP_DP > .pin1"
/>
<trace
name="USB_DM"
from=".J1 > .USB_DM"
to=".TP_DM > .pin1"
/>
<differentialpair
name="USB_DATA"
positiveConnection="USB_DP"
negativeConnection="USB_DM"
maxLengthSkew={0.05}
/>
maxLengthSkew sets the maximum absolute routed-length difference in
millimeters. It does not set pair spacing or differential impedance. See the
dedicated page for complete, runnable examples using trace names and named pin
selectors.
Net vs Direct connections
There are generally two ways that traces are represented on a PCB "Rats Nest" or on a schematic and they have very different results:
- Net - A trace that connects a net to a component pin.
<trace from="net.GND" to=".R1 > .pin1" />
- Direct - A trace that connects two component pins directly.
<trace from=".R1 > .pin1" to=".C2 > .pin2" />
When you specify a trace with a net, the autorouter will look for the best place to tie into the net. This means you're not specifying the exact location where the trace will go.
When using net connections we use a Rats Nest on a PCB view or a net label on a schematic view. When you see a dotted line on a Rats Nest, you should think of it as a possible connection point, but not necessarily the final place where the autorouter will connect to the net.
Creating a direct path with a custom thickness
Use an empty pcbPath array to keep the autorouter's direct path between two
ports while overriding the trace width via the thickness property.