Motion On Scroll (MOS)

   

Effortless, AOS-compatible scroll animations powered by Motion.

Framework-agnostic, MOS lets you add scroll-triggered animations with nothing but data-mos attributes. Under the hood it uses Motion’s powerful animate API, giving you:

- 27 preset effects out of the box
- Support for custom keyframes, easings, and fully bespoke timelines
- AOS-compatible features for painless migration
- First-class TypeScript types

> 📚 Full docs → motion-on-scroll.pages.dev

---

Quick start

``bash
npm i motion-on-scroll
`

`html










`

Migrating from AOS? Check the guide →

---

Basic usage

All you have to do is to add data-mos attribute to html element, like so:

`html



``

Script will trigger "animation_name" animation on this element, if you scroll to it.