Package Exports
- locomotive-scroll
- locomotive-scroll/dist/locomotive-scroll.cjs
- locomotive-scroll/dist/locomotive-scroll.cjs.map
- locomotive-scroll/dist/locomotive-scroll.css
- locomotive-scroll/dist/locomotive-scroll.mjs
- locomotive-scroll/dist/locomotive-scroll.mjs.map
- locomotive-scroll/dist/locomotive-scroll.modern.mjs
- locomotive-scroll/dist/locomotive-scroll.modern.mjs.map
- locomotive-scroll/dist/locomotive-scroll.umd.js
- locomotive-scroll/dist/locomotive-scroll.umd.js.map
- locomotive-scroll/dist/types/core/Core.d.ts
- locomotive-scroll/dist/types/core/Core.d.ts.map
- locomotive-scroll/dist/types/core/IO.d.ts
- locomotive-scroll/dist/types/core/IO.d.ts.map
- locomotive-scroll/dist/types/core/ScrollElement.d.ts
- locomotive-scroll/dist/types/core/ScrollElement.d.ts.map
- locomotive-scroll/dist/types/index.d.ts
- locomotive-scroll/dist/types/index.d.ts.map
- locomotive-scroll/dist/types/types.d.ts
- locomotive-scroll/dist/types/types.d.ts.map
- locomotive-scroll/dist/types/utils/maths.d.ts
- locomotive-scroll/dist/types/utils/maths.d.ts.map
- locomotive-scroll/locomotive-scroll.css
Readme
Locomotive Scroll
A lightweight & modern scroll library for detection, animation, and smooth scrolling. Built on top of Lenis.
Documentation
Full documentation available at scroll.locomotive.ca/docs.
Quick Start
npm install locomotive-scrollimport LocomotiveScroll from 'locomotive-scroll';
const scroll = new LocomotiveScroll();@import 'locomotive-scroll/dist/locomotive-scroll.css';<div data-scroll data-scroll-speed="0.5">I move at half speed</div>Features
- Lightweight — Only 9.4kB gzipped
- TypeScript First — Fully typed
- Built on Lenis — Latest stable release with improved performance
- Dual Intersection Observers — Optimized detection for triggers vs. animations
- Smart Touch Detection — Parallax auto-disabled on mobile
- Accessible — Native scrollbar, keyboard navigation, proper ARIA support
Demo
Check out the examples and playground