Motion AI Kit
Ground your AI agent in current, performance-checked Motion knowledge, straight from the team that builds it.
AI agents tend to guess at animation code, often from outdated or low-quality sources. The Motion AI Kit ensures your AI assistant uses the best, modern practices.
/motion skill.linear() spring curves on demand. No animation library needed.Features
Context
AI is trained on data that's often out of date, or on low-quality Stack Overflow/Reddit posts.
The Motion AI Kit includes skills containing best practices, lets your agent query the latest Motion docs for knowledge of the latest APIs, as well as pulling in the source code of 400+ premium Motion+ examples for recommended patterns across a wide range of popular effects and interactions.
MotionScore Performance Audit
Find and fix animation performance issues with MotionScore. It performs code analysis and runtime profiling to grade your animations based on their render-pipeline cost, supporting Motion, CSS, GSAP and more. Your agent can use this report, complete with fix recommendations, to instantly upgrade your site's performance.
Transition Editing
The AI Kit enables real-time editing and preview of CSS and Motion transitions, without leaving your editor. It supports editing easing curves and springs, with the latter able to generate CSS code via the linear() easing curve.
Your favourite transitions can be saved and reused both in the transition editor and by your agent via the MCP.
Generate CSS Springs
The /motion skill can generate CSS linear() easing curves to create springs and other custom easing functions, using Motion without the runtime.