Supercharge your animation development process with Motion for VS Code.
- Copilot docs: Turn Copilot into a Motion expert with the latest docs.
- Copilot CSS generation: Enhance Copilot's CSS generation with real Motion springs.
Additionally, Motion+ users gain access to:
- Bezier curve editor: Edit and preview CSS and Motion easing curves.
- More features coming soon
Install via the VS Code Marketplace
Generate a personal access token, then click "Authenticate" in the Motion panel to open an input dialog for your token.
Load the latest Motion documentation directly into Copilot. Add docs to a chat by clicking on "Add Context":
Navigating to "MCP Resources..."
Search for the docs you're looking for:
With Motion for Visual Code Studio, Copilot gains the ability to generate CSS linear()
easing curves to create springs or other custom easing curves.
Generate a CSS spring that's quite bouncy
600ms linear(0, 0.0121 /* ... */)
Learn more about CSS generation
When editing a CSS or Motion bezier easing curve while the Motion panel's open, a bezier curve editor will appear. Changes will be immediately reflected in your code.
Found a bug or have a feature request? Open an issue on the Motion repo.