An open API service indexing awesome lists of open source software.

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

Awesome Lists containing this project

README

          

Motion logo
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

![Video of bezier curve editing](https://framerusercontent.com/images/KO5dnHOUSNGb9S73p1J7nLhoFI.gif)

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.


Framer

### Platinum

Tailwind Linear

### Gold

Tailwind Emil Kowalski Liveblocks Vercel Luma Notion

### Silver

Frontend.fyi Firecrawl Puzzmo Bolt.new

### Personal sponsors

- [OlegWock](https://sinja.io)
- [Lambert Weller](https://github.com/l-mbert)
- [Jake LeBoeuf](https://jklb.wf)
- [Han Lee](https://github.com/hahnlee)