OSS Tanbou
View on GitHubProject website

build web animation with gestures, springs, layout transitions, scroll effects, and timelines across React, JavaScript, and Vue

OSS scale score Not calculatedOSS health 100
About these scores

OSS scale score is an unbounded metric that log-compresses and weights Stars, Watchers, Forks, and Contributors. Discovery score is the current OSS scale score minus the score at discovery. Update pace is commits in the last 30 days, growth momentum is the OSS scale score difference within the recent observation window, and OSS health is a 0–100 rating based on available recency, Community Health, and release data.

Stars
33,775
Primary language
TypeScript
License
MIT
Repository last updated
Sep 30, 2026
On this page

Overview

Motion is a web-animation library for React, JavaScript, and Vue. It combines JavaScript flexibility with native browser APIs and provides gestures, springs, layout transitions, scroll-linked effects, and timelines. React users access the former Framer Motion line through motion/react.

Features and best fit

Based on official documentation; not hands-on tested · Content checked:

Key features

Use one animation ecosystem across React, JavaScript, and Vue

React uses motion/react, JavaScript uses motion, and Vue uses motion-v, giving each framework an API that maps to the same broader animation ecosystem.

Sources: [2][3]

Combine gestures, springs, layout changes, scroll effects, and timelines

The README highlights gestures, springs, layout transitions, scroll-linked effects, and timelines, powered by a hybrid approach that combines JavaScript with native browser APIs.

Sources: [2]

Best fit

Fits interactive web interfaces that want animation logic close to component and application code

It is useful for hover and drag interactions, page transitions, layout changes, and scroll-driven effects that need to remain integrated with React or JavaScript application logic.

Sources: [2]

Before adoption

Account for the Framer Motion rename and import-path change

The README states that Framer Motion is now Motion and recommends motion/react instead of framer-motion for React usage. Existing applications should avoid mixing old and new package conventions.

Sources: [2]

Keep the MIT core separate from Motion+ premium content

The Motion repository is MIT-licensed, while the README separately advertises Motion+ premium APIs, examples, and source. Evaluate the open-source core and paid content as distinct scopes.

Sources: [2][4]

Official sources

  1. [1]motiondivision/motion repository(2026-09-30)
  2. [2]Motion README(2026-09-30)
  3. [3]motion 13.4.6 package metadata(2026-09-30)
  4. [4]Motion MIT license(2026-09-30)
Supplemental curator note

The README states that Framer Motion is now Motion and directs React users to import from motion/react. The motion 13.4.6 package treats React and React DOM 18 or 19 as optional peer dependencies. The core repository is MIT-licensed, while Motion+ premium content is a separate offering.

Try it in 3 steps

  1. 1

    Install Motion 13.4.6

    Pin the current package version in an existing React project.

    npm install motion@13.4.6
  2. 2

    Import the React motion component

    Follow the README guidance and import from motion/react rather than the old framer-motion path.

    import { motion } from "motion/react";
  3. 3

    Render a minimal animation

    Verify a simple position animation first, then expand into gestures, springs, layout, or scroll effects.

    <motion.div animate={{ x: 100 }} />
Check the official README

Growth

Growth trends · Last 30 days

33,775 Stars

Trend data is still being collected.

Built with

Categories and tags

Categories

Tags

GitHub data

GitHub dataView detailed GitHub data
View on GitHub

GitHub Topics

  • animation
  • animation-js
  • motion
  • react
  • reactanimations
  • spring
Stars
33,775
Forks
1,379
Watchers
124
Open issues
111
Owner type
Organization
Primary language
TypeScript
License
MIT
Repository last updated
Sep 30, 2026
Write a related article

Share a guide or use case for this OSS in Markdown. Articles are published after administrator approval.

Report incorrect information

Tell us if any listing information is incorrect or outdated.

After reading this page, do you know what to do next?