An animation library inspired by framer-motion

Temporary scoped fork of the rewrite branch, published as @johly/motion until the upstream rewrite is published.

[!WARNING] Note: 🚧 This library is currently in alpha. Features and APIs may change. expect bugs and please report or make PRs to fix bugs.

Note: This is svelte-motion ported to typescript currently. We have plans to evolve it to include modern features in framer-motion and to use svelte/motion to implement animations in the future.

Installation

npm install --save-dev @johly/motion

pnpm install --save-dev @johly/motion

yarn install --save-dev @johly/motion

bun install --save-dev @johly/motion

Usage

Corresponding to a MotionDiv in framer-motion is this:

import { motion } from '@johly/motion'

<motion.div></motion.div>

For svg elements like 'g', 'path' or 'circle', use:

<motion.g></motion.g>

Community

Join the Discord server to ask questions, find collaborators, or say hi!