DEDUPED Hot AI repos. Real use cases. What people build. Get the Monday 5

How to add scroll animation with GSAP and reduced-motion fallbacks with Design Taste

Use taste-gsap and taste-motion so an agent adds GSAP motion with gating and accessibility built in.

Short answer: Run git clone https://github.com/madebymustafa/design-taste.git and then cd design-taste; then run ./scripts/install.sh or copy the skills/taste-gsap and skills/taste-motion folders into your agent's skills directory; install the GSAP library in your project following the GSAP documentation, since the README does not describe how to add it. All steps.

Who it is forA frontend developer building a marketing or product page who wants scroll-driven motion without janky pins or ignored reduced-motion settings.

The problemAgent-written GSAP code often skips context gating, pin and scrub hygiene, and reduced-motion handling.

The outcomeA page section with GSAP animation that uses context and matchMedia gating, transform-only motion, and a reduced-motion fallback.

What you need first

  • git and a terminal to clone the repo
  • An AI coding agent such as Claude Code, Codex, Cursor, or opencode
  • A web browser to open the before and after HTML examples
  • A brief for the page or interface you want to build

Steps

  1. Run git clone https://github.com/madebymustafa/design-taste.git and then cd design-taste.
  2. Run ./scripts/install.sh or copy the skills/taste-gsap and skills/taste-motion folders into your agent's skills directory.
  3. Install the GSAP library in your project following the GSAP documentation, since the README does not describe how to add it. (inferred, check the README)
  4. Ask your agent to add the animation to one section and to apply the taste-gsap and taste-motion rules.
  5. Test the page with the operating system reduced-motion setting turned on and confirm the fallback appears.

Prompt for your agent

Using the taste-gsap and taste-motion skills in the design-taste repo, add a scroll animation to the <section name> of <project path>, with context and matchMedia gating and a reduced-motion fallback. Output the changed files and verify that animation runs only through transform properties.

Caveat. The README lists GSAP craft rules but does not say which GSAP version or setup the skill expects, so check your project's GSAP setup first.

Use this in your AI agent

Ask your agent

Using the Deduped MCP, get the setup steps for madebymustafa/design-taste and "Add scroll animation with GSAP and reduced-motion fallbacks"

Add Deduped to Claude Code once

claude mcp add --transport http deduped https://dedupedai.com/mcp

Cursor, ChatGPT, others

Share: X LinkedIn Hacker News Email Copy link

Third-party repos we don't own. AI-written use cases can be wrong. Disclaimer