agentsclimarketplace
Sign in

Animation tool router

Skill TheGoat395/Codex-Skills/skills/animation-tool-router

Use when planning or implementing website motion, scroll choreography, microinteractions, page transitions, text reveals, pinned sections, smooth scrolling, Lottie, Three.js/R3F, WebGL, or animation-heavy premium sites. Chooses the lightest appropriate tool and defines reduced-motion fallbacks.From its SKILL.md

Install
npx -y skills add TheGoat395/Codex-Skills --skill animation-tool-router

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

SKILL.md

1.5 KB, 254 tokens by cl100k_base, as published. Nobody here has run it

Animation Tool Router

Use this skill to choose motion tools by purpose, not hype.

Routing

  • CSS transitions: hover/focus states, small fades, transforms, simple menus.
  • Motion: React component animation, layout transitions, presence, gestures, small scroll reveals.
  • GSAP: precise timelines, pinned scroll scenes, split text, SVG paths, complex choreography.
  • Lenis: smooth scroll feel when the project can support it and anchor/modal behavior is handled.
  • Lottie: exported vector motion when file weight and accessibility are acceptable.
  • Three.js/R3F: real 3D product/scene work, not decoration.
  • No dependency: static content where motion would distract or harm performance.

Motion Requirements

Define:

  • purpose: reveal, continuity, depth, state, tactility, narrative, or product explanation
  • trigger: load, hover, focus, click, route, scroll, drag, or viewport
  • duration/easing
  • reduced-motion fallback
  • cleanup/unmount behavior
  • performance risks

Avoid

  • animation because the page is otherwise generic
  • scroll hijacking
  • motion that hides content
  • parallax that causes nausea or jank
  • WebGL scenes that are blank on mobile

What ships with it: 1 file

234 B alongside SKILL.md

agents/

Keep looking

Skills are one crate of 325,949. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.