Marquee Loop
From Skills by @mengto · View on GitHub
Apply seamless infinite marquee loops using duplicated items.
●
INSTALL
This skill ships inside the skills package. Install the package to get this skill plus everything else in the bundle.
sv install mengto/skills
●
SKILL.MD
Marquee Skill
Use When
- A design needs a seamless infinite loop for logos, testimonials, screenshots, tags, or short feature chips.
Workflow
- Duplicate the item sequence so the end and beginning match perfectly.
- Animate the track with a linear transform from 0 to -50%.
- Keep item widths stable to prevent jumps during the loop.
- Mask or fade the edges when the marquee enters or exits a section.
- Pause or slow the marquee on hover only when interaction is useful.
- Respect prefers-reduced-motion with a static wrap or very slow movement.
Guardrails
- Do not animate unique content that users must read carefully.
- Do not use large CPU-heavy shadows or filters on every moving item.