motion-foundations
Motion tokens, spring presets, performance rules, device adaptation
by affaan-mFree
Description
motion-foundations is an agent skill from the ECC collection by affaan-m, listed on skills.sh. It is the base layer of a motion system for React and Next.js using motion/react. It defines the motion tokens, spring presets, easing values and the rules that the other motion skills inherit, so an agent should load it before any animation work begins. It covers performance rules, adapting motion to devices, enforcing accessibility such as support for reduced-motion preferences, and avoiding server-side rendering problems, including hydration mismatches caused by animation starting states. It also helps decide whether an animation should exist at all. The skill applies when an animated component is started from scratch, when tokens, spring presets or easing are being set up, and when debugging hydration issues. It is a SKILL.md file of instructions that an AI agent loads when a task calls for it. It is free and open source, and the skills.sh listing shows all three security audits passing.…
Highlights
- Motion tokens and spring presets
- Reduced-motion accessibility
- Performance and device rules
- SSR and hydration safety
Ratings & Reviews
No ratings yet
Be the first to rate motion-foundations.
People also visit
motion-foundations FAQ
What does the motion-foundations skill do?
It sets the tokens, spring presets and rules that other motion skills build on, for React and Next.js with motion/react.
Should I load it first?
Yes. The listing says to load it before any animation work starts.
Does it handle reduced motion?
Yes. It covers prefers-reduced-motion support and accessibility enforcement.
How do I install it?
Run: npx skills add https://github.com/affaan-m/ecc --skill motion-foundations
Is it free?
Yes. It is free and open source.
Are there security findings?
The skills.sh listing shows Gen Agent Trust Hub, Socket and Snyk all passing.
What are the best motion-foundations alternatives?
Popular alternatives to motion-foundations include motion-advanced, motion-patterns and motion-ui. See all motion-foundations alternatives