Which library does it use for what?

GSAP with ScrollTrigger for scroll and timelines, Motion for component mount and unmount, Lenis for smooth scrolling and Anime.js for lightweight DOM animation.

Does it respect users who disable motion?

Yes. It includes patterns for honoring prefers-reduced-motion and says not to hide essential content behind reveals that depend only on animation.

Does it work without React?

It is written for React, with examples such as useGSAP and ReactLenis. Outside React you would have to adapt the patterns yourself.

Built hereUpdated 28 Mar 2026

Awwwards-level React animations

/web--awwwards-animations

/web--awwwards-animations is a Claude Code skill in the Web & Design section. Picks the right tool (GSAP, Motion, Anime.js or Lenis) and builds smooth, accessible React animations: scroll effects, magnetic hovers and reveals.

Author's description

Awwwards-level React animations — GSAP, Motion, Anime.js, Lenis smooth scroll, ScrollTrigger, magnetic effects

Use it when

You want scroll-driven animations or complex sequences in React
You need to choose between GSAP, Motion, Anime.js and Lenis
You are after effects like magnetic cursors or text and image reveals

Not for

Projects that do not use React
Replacing a full accessibility review of your site

What you get

React code with the animations implemented, following the skill's performance and reduced-motion rules.

How to ask for it

/web--awwwards-animations add Awwwards-style smooth scroll with Lenis
/web--awwwards-animations create a button with a magnetic hover effect
/web--awwwards-animations animate sections on scroll with GSAP ScrollTrigger

Install

curl -fsSL https://raw.githubusercontent.com/sgomez-dev/claude-skills/main/install.sh | bash

After installing with the script, type /web--awwwards-animations. Using Cursor, Windsurf or Codex? Platform guides

Questions about this skill

Which library does it use for what?: GSAP with ScrollTrigger for scroll and timelines, Motion for component mount and unmount, Lenis for smooth scrolling and Anime.js for lightweight DOM animation.
Does it respect users who disable motion?: Yes. It includes patterns for honoring prefers-reduced-motion and says not to hide essential content behind reveals that depend only on animation.
Does it work without React?: It is written for React, with examples such as useGSAP and ReactLenis. Outside React you would have to adapt the patterns yourself.

Demo coming soon