Motion One

Tiny size.
Huge performance.

A new animation library, built on the Web Animations API for the smallest filesize and the fastest performance.

npm install motion
Quick start

Shockingly simple.

Motion One packs the power of the Web Animations API into a minimal API.

It adds new features like selectors, individual transforms, timeline sequencing and more.

animate("#ball", { scale: 1.3 })
Quick start

Size matters.

A great web experience doesn't just look amazing, it loads fast.

Motion One's animate function is just 3.3kb, less than half of Anime.js.

Compare features
3.3
Motion One
7
Anime.js
23
Greensock

Max performance.

Motion One uses hardware accelerated animations where possible.

So your UI stays snappy and responsive, even under heavy workloads.

Performance guide

Accelerated animations

Normal (simulated)

And more...

  • Keyframes

    Simple array syntax for quick animation sequencing.

  • Timeline

    Create intricate animations across multiple elements.

  • Springs

    Velocity-based springs for naturalistic animation.

  • Production-ready

    Written in TypeScript, with full test coverage.

  • Free for all

    Published under MIT. No annual commercial license to worry about.

  • Old dog, new tricks

    Created by the author of Framer Motion, Pose, and Popmotion.

Get started with Motion One's interactive quick start guide.

Quick start