whatisgithub

What is lenis?

darkroomengineering/lenis — explained in plain English

Analysis updated 2026-06-24

13,866TypeScriptAudience · developerComplexity · 2/5Setup · easy

In one sentence

A lightweight JavaScript library that adds smooth, inertia-based scrolling to any website, with easy integrations for React, Vue, Framer, and GSAP so scroll-driven animations stay perfectly in sync.

Mindmap

mindmap
  root((repo))
    What it does
      Smooth scrolling
      Inertia effect
      Scroll events
    Integrations
      React package
      Vue package
      GSAP compatible
      Framer support
    Features
      Snap scrolling
      Nested scroll areas
      Anchor link handling
    Tech Stack
      TypeScript
      JavaScript
      npm
    Setup
      CDN script tag
      npm install
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Add buttery smooth inertia scrolling to a portfolio or creative website with two lines of JavaScript and no build tool required.

USE CASE 2

Sync GSAP scroll-triggered animations, parallax sections, element reveals, with Lenis's custom scroll position so they stay in perfect sync.

USE CASE 3

Build a React portfolio with smooth scrolling by installing the Lenis npm package and wrapping the layout component.

USE CASE 4

Create a scroll-snapping one-page site with full-height sections using Lenis's snap add-on package.

What is it built with?

TypeScriptJavaScriptnpmReactVueGSAPFramer

How does it compare?

darkroomengineering/lenisshoelace-style/shoelacebuilderio/mitosis
Stars13,86613,86613,834
LanguageTypeScriptTypeScriptTypeScript
Setup difficultyeasyeasymoderate
Complexity2/52/53/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 5min

So what is it?

Lenis is a small JavaScript library that makes scrolling on websites feel smoother. When you scroll a normal webpage, the movement is instant and can feel mechanical. Lenis intercepts that scrolling and adds a gentle inertia, so the page glides to a stop rather than cutting off abruptly. The name comes from the Latin word for smooth. The library is designed to be lightweight and to perform well on modern browsers. It works well alongside other animation tools. The README shows an example of connecting it with GSAP, a popular animation library, so that scroll-driven effects like parallax sections or element reveals stay in sync with Lenis's custom scroll position. It is also commonly used on creative or portfolio-style websites that include WebGL effects. Getting started is straightforward. For a basic setup you can drop two lines into any HTML page without needing a build tool at all: one line loads the stylesheet and another loads the script, then a single line of JavaScript turns smooth scrolling on. For more complex projects, Lenis is available as a package through npm and has dedicated integrations for React, Vue, and Framer. There is also a snap package that adds scroll snapping behavior. The settings let you tune the feel of the scroll, control how nested scrollable areas behave, handle anchor link clicks, and configure automatic resizing. Events are emitted on each scroll frame, which makes it straightforward to synchronize other animations or track scroll progress. The project is sponsored by several studios and individuals and is part of Vercel's open-source program. It is maintained by the design and development studio darkroom.engineering. The full README is longer than what was shown.

Copy-paste prompts

Prompt 1
Set up Lenis smooth scrolling in a plain HTML page using a CDN script tag, then connect it to GSAP ScrollTrigger so a parallax section animates correctly as the user scrolls.
Prompt 2
Show me how to install Lenis in a React project, wrap my App component so all pages have smooth inertia scrolling, and pause Lenis when a modal is open.
Prompt 3
I'm building a Vue 3 portfolio. Write the code to integrate Lenis smooth scroll using its Vue plugin and fire a custom animation when scroll progress reaches 50% of the page height.
Prompt 4
Using Lenis, implement scroll-snap behavior between three full-height sections on a one-page site, with a smooth glide between each snap point.

Frequently asked questions

What is lenis?

A lightweight JavaScript library that adds smooth, inertia-based scrolling to any website, with easy integrations for React, Vue, Framer, and GSAP so scroll-driven animations stay perfectly in sync.

What language is lenis written in?

Mainly TypeScript. The stack also includes TypeScript, JavaScript, npm.

How hard is lenis to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is lenis for?

Mainly developer.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.