Trigger
Connection line
An SVG bezier curve between two ports. The base track is a soft grey line, the flow line is dashed and animated to indicate flow direction. Supports red / amber / teal / green / neutral tones and an optional midpoint label chip. Reduced-motion stops the dash flow.
Production answer
Connection line is a reusable Oak Flats Muffler Men UI primitive with documented states, accessibility expectations, theme behavior, and implementation evidence.
Primary CTAReview Connection line states
Generative search brief
Connection line: An SVG bezier curve between two ports. The base track is a soft grey line, the flow line is dashed and animated to indicate flow direction. Supports red / amber / teal / green / neutral tones and an optional midpoint label chip. Reduced-motion stops the dash flow.