CtrlK
BlogDocsLog inGet started
Tessl Logo

marquee-loop

Apply seamless infinite marquee loops using duplicated items.

55

Quality

61%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Low

Low-risk findings worth noting

Fix and improve this skill with Tessl

tessl review fix ./agent-skills/web-design/marquee-loop/SKILL.md
SKILL.md
Quality
Evals
Security

Marquee Skill

Use When

  • A design needs a seamless infinite loop for logos, testimonials, screenshots, tags, or short feature chips.

Workflow

  1. Duplicate the item sequence so the end and beginning match perfectly.
  2. Animate the track with a linear transform from 0 to -50%.
  3. Keep item widths stable to prevent jumps during the loop.
  4. Mask or fade the edges when the marquee enters or exits a section.
  5. Pause or slow the marquee on hover only when interaction is useful.
  6. 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.
Repository
MengTo/Skills
Last updated
First committed

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.