Summary
This is where you go after motion-patterns stops being enough. It covers drag interactions, gesture detection, text animations that reveal word by word or count up, SVG path drawing, and imperative sequences with useAnimate. The custom hooks section is especially practical: scroll reveals, hover effects, navigation direction detection. The decision tree is helpful for picking between useSpring and spring transitions, and the drag examples cover both simple draggable cards and full drag-to-dismiss sheets with proper offset and velocity thresholds. If you're building reorderable lists, swipeable carousels, or loading states that feel polished, this has the patterns you need.
Install to Claude Code
npx -y skills add affaan-m/everything-claude-code --skill motion-advanced --agent claude-codeInstalls into .claude/skills of the current project.
Plug Mailtrap into your AI workflow and let it handle the email.
Connect Mailtrap MCP →
Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →
Make coding agent sessions - Searchable, Shareable, Vendor-neutral & Scored.
Try For Free →
Your agent targets a perfect 10 Code Health score. Deterministic. Every commit.
Try For Free →
Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →
belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →Files
SKILL.md
Select a file.
Featured
Plug Mailtrap into your AI workflow and let it handle the email.
Connect Mailtrap MCP →Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →Make coding agent sessions - Searchable, Shareable, Vendor-neutral & Scored.
Try For Free →Your agent targets a perfect 10 Code Health score. Deterministic. Every commit.
Try For Free →Integrate web data into your AI product. One API to scrape website & brand data.
Get API Key Now →belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →
