https://github.com/motiondivision/motion-vue
Motion for Vue
https://github.com/motiondivision/motion-vue
animation framer-motion motion motion-vue vue
Last synced: about 1 month ago
JSON representation
Motion for Vue
- Host: GitHub
- URL: https://github.com/motiondivision/motion-vue
- Owner: motiondivision
- License: mit
- Created: 2024-11-15T01:38:01.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2026-02-07T16:40:56.000Z (about 1 month ago)
- Last Synced: 2026-02-08T00:57:10.985Z (about 1 month ago)
- Topics: animation, framer-motion, motion, motion-vue, vue
- Language: TypeScript
- Homepage: https://motion.dev
- Size: 2.01 MB
- Stars: 2,125
- Watchers: 4
- Forks: 56
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README

Motion for Vue
Motion for Vue is an open source, production-ready library thatβs designed for all creative developers.
It's the only animation library with a hybrid engine, combining the power of JavaScript animations with the performance of native browser APIs.
It looks like this:
```jsx
```
It does all this:
- Springs
- Keyframes
- Layout animations
- Shared layout animations
- Gestures (drag/tap/hover)
- Scroll animations
- SVG paths
- Exit animations
- Server-side rendering
- Independent transforms
- Orchestrate animations across components
- CSS variables
...and a whole lot more.
## Get started
### π Quick start
Install `motion-v` via your package manager:
```
npm install motion-v
```
Then import the `motion` component:
```vue
import { motion } from 'motion-v'
```
## β‘οΈ Motion+
Learn, Design, Build. [Motion+](https://motion.dev/plus) is a one-time fee, lifetime update membership that provides:
- 160+ premium Motion Examples
- Motion UI features like Cursor and Ticker
- Motion Studio animation editing for VS Code `alpha`
- Early access content
- Private Discord
[Get Motion+](https://motion.dev/plus)
## π¨ Studio

Motion Studio is a versatile suite of developer tools allowing you to:
- Visually edit CSS and Motion easing curves in VS Code
- Generate CSS springs with LLMs
- Load Motion docs into your LLM
Get started with [Motion Studio](https://motion.dev/docs/tools-quick-start).
### π Contribute
- Want to contribute to Motion? Our [contributing guide](https://github.com/motiondivision/motion-vue/blob/master/CONTRIBUTING.md) has you covered.
- [Join our discord ](https://discord.com/invite/dCBuRgdNDG)
### π©π»ββοΈ License
- Motion for Vue is MIT licensed.
## β¨ Sponsors
Motion is sustainable thanks to the kind support of its sponsors.
### Partners
#### Framer
Motion powers Framer animations, the web builder for creative pros. Design and ship your dream site. Zero code, maximum speed.
### Platinum
### Gold
### Silver
### Personal sponsors
- [OlegWock](https://sinja.io)
- [Lambert Weller](https://github.com/l-mbert)
- [Jake LeBoeuf](https://jklb.wf)
- [Han Lee](https://github.com/hahnlee)