Marquee Along Path

Show Preview
Marquee Along Path

About Marquee Along Path

Marquee Along Path is a customizable Framer component for animating image cards along an SVG path. Instead of a standard straight-line marquee, it lets your visuals travel through waves, loops, orbital curves, rising paths, or any custom SVG path you paste in.

It is built for designers who want a more expressive way to show portfolios, product images, client logos, gallery items, moodboards, or visual highlights inside a Framer site. You can use the built-in path presets for quick results, or switch to a custom SVG path for a fully tailored motion route.

The component includes controls for image items, item size, border radius, shadows, borders, object fit, animation speed, direction, repeat count, start offset, hover slowdown, hover scale, drag-to-scrub interaction, guide path visibility, path color, stroke width, dash style, labels, background color, and accessibility label.

It is responsive by default, supports Framer’s static rendering, respects reduced-motion preferences, and includes fallback behavior if a custom SVG path is invalid. This makes it suitable for real production pages, not just experimental visual sections.

Best For

  • Portfolio image trails

  • Product showcase sections

  • Creative agency landing pages

  • Brand/logo motion strips

  • Editorial or gallery layouts

  • Interactive hero backgrounds

  • Visual storytelling sections

Key Features

  • Animate images along editable SVG paths

  • Built-in path presets: Wave, Loop, Orbit, and Rise

  • Custom SVG path support

  • Drag-to-scrub interaction

  • Hover slowdown and hover scaling

  • Optional visible guide path

  • Optional labels on each item

  • Responsive sizing

  • Reduced-motion support

  • Clean Framer property controls

  • No external demo asset dependency