KQ-1888 · SWITCHBACK/TRAILS

Switchback Trails

A dusk view across a valley to a mountain road zigzagging down a slope in hairpins, its legs smaller and thinner the higher they climb, with cars driving it both ways — warm-white headlights coming down, red tail lights going up — slowing into every hairpin. Press and hold to open the shutter: an iris opens on the springs.snap constants, a readout counts the seconds, and each car's lights are drawn from where they were to where they are into an additive exposure layer, so white and red trails build along the hairpins, brightest where the cars slow, while the sky lifts as a long exposure does. Release and the iris closes on the exit ease as the photograph develops with a halation bloom, holds, and slowly fades; Space opens it while held, Enter toggles it, Escape closes it.

KQ-1888 · SWITCHBACK/TRAILS

Fieldline Camera · Night pass

The Harrow road at dusk

hold to open the shutter · ±0.0 EV

Open it on the Canvas stage

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/switchback-trails

Props

exposure: number; default 0; Exposure compensation, EV −2 (faint streaks) to +2 (blown rivers of light): how fast light builds and how wide the trails bloom.
traffic: number; default 0.5; How busy the road is, 0 (an empty pass) to 1 (a steady stream).
dusk: number; default 0.55; The light, 0 (last warm light) to 1 (deep blue hour with stars).
open / defaultOpen: boolean; default — / false; The shutter is open.
onOpenChange: (open: boolean) => void; default —; Fires from the press, release or key that opened or closed the shutter.
onExpose: (shot: { seconds: number; cars: number }) => void; default —; Fires as the shutter closes, with how long it was open and how many cars drew a trail.
fade: number; default 6000; How long the developed photograph takes to fade back to the live view, ms.
develop: boolean; default true; The halation bloom that swells as the photograph develops.
speed: number; default 1; How fast the cars drive, 0.5 to 2.
maxExposure: number; default 30; The shutter closes by itself after this long, seconds.
lightColors: [string, string]; default warm white and red pigments; Headlights and tail lights, CSS colours.
stars: boolean; default true; Stars come out as the dusk deepens.
paused: boolean; default false; Hold the live traffic still (an open shutter still records).
seed: number; default 5; Seeds the mountains, the traffic and the stars.
dpr: number; default 2; Cap on the canvas's device pixel ratio, at most 2.
label: string; default "Hold to open the shutter"; The control's accessible name.
disabled: boolean; default false; No pressing or keys; the view dims.
className: string; default —; Sizes the view; it fills its parent by default.

Prop	Type	Default	Description
exposure	number	0	Exposure compensation, EV −2 (faint streaks) to +2 (blown rivers of light): how fast light builds and how wide the trails bloom.
traffic	number	0.5	How busy the road is, 0 (an empty pass) to 1 (a steady stream).
dusk	number	0.55	The light, 0 (last warm light) to 1 (deep blue hour with stars).
open / defaultOpen	boolean	— / false	The shutter is open.
onOpenChange	(open: boolean) => void	—	Fires from the press, release or key that opened or closed the shutter.
onExpose	(shot: { seconds: number; cars: number }) => void	—	Fires as the shutter closes, with how long it was open and how many cars drew a trail.
fade	number	6000	How long the developed photograph takes to fade back to the live view, ms.
develop	boolean	true	The halation bloom that swells as the photograph develops.
speed	number	1	How fast the cars drive, 0.5 to 2.
maxExposure	number	30	The shutter closes by itself after this long, seconds.
lightColors	[string, string]	warm white and red pigments	Headlights and tail lights, CSS colours.
stars	boolean	true	Stars come out as the dusk deepens.
paused	boolean	false	Hold the live traffic still (an open shutter still records).
seed	number	5	Seeds the mountains, the traffic and the stars.
dpr	number	2	Cap on the canvas's device pixel ratio, at most 2.
label	string	"Hold to open the shutter"	The control's accessible name.
disabled	boolean	false	No pressing or keys; the view dims.
className	string	—	Sizes the view; it fills its parent by default.