Path Draw
SVG stroke reveal along a path.
PrimitivePaths & shapesAdvanced
path-draw30fps · 960×540
Install
$ npx remotion-ui@latest add path-drawAnimates SVG stroke reveal using @remotion/paths evolvePath().
Advanced. Installs @remotion/paths.
Agent notes
Install first, then import the copied source component locally. AI guide →
Import
@/remotion/primitives/path-draw- Use when: frame-level motion primitives and reusable animation wrappers.
- Customize: d, durationInFrames, stroke, plus copied source for timing, layout, colors, and typography.
- Rule: do not import this component from the
remotion-uinpm package; it is copied into your project.
Usage
Example
import { PathDraw } from "@/remotion/primitives/path-draw";
<PathDraw d="M 10 10 L 190 190" durationInFrames={60} />API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| d* | string | - | SVG path d attribute. |
| durationInFrames | number | 60 | Draw animation length. |
| stroke | string | "#ffffff" | Stroke color. |