Enhance Your Website’s User Experience with Lenis Smooth Scroll Library

What exactly is Lenis?

Lenis is a smooth scroll library. It is lightweight, robust, and efficient. It was created by @darkroom.engineering to be user-friendly and easily integrated into various projects. The library prioritizes performance and is tailored for contemporary browsers. It is ideal for generating seamless scroll experiences on websites you build.

To begin using Lenis, follow these steps:

First, you need to install it.

You have the option to install it using a package manager.

npm i lenis

Then import it to use it:

import Lenis from 'lenis'

Or you can also add the script tag to your web page

<script src="https://unpkg.com/lenis@1.1.5/dist/lenis.min.js"></script> 

Once you have installed the library, you can set up the smooth scroll feature by adding the following script to your app.

const lenis = new Lenis()

lenis.on('scroll', (e) => {
    console.log(e)
})

function raf(time) {
    lenis.raf(time)
    requestAnimationFrame(raf)
}

requestAnimationFrame(raf)

To experience the smooth scroll effect, simply refresh your web app.

To access more comprehensive details, please explore their documentation, https://github.com/darkroomengineering/lenis

Happy scrolling!