Add fade-in and slide animations to images and cards on a marketing website as visitors scroll down.
Create a polished portfolio site where project descriptions reveal themselves smoothly when they enter the viewport.
Build an engaging landing page with staggered animations on headings and call-to-action buttons without writing scroll detection code.
ScrollReveal is a small JavaScript library that adds animations to elements on a webpage as the user scrolls down and those elements come into view. Instead of everything appearing static when the page loads, items like headings, images, or cards can fade in, slide up, or reveal themselves smoothly as the visitor scrolls to them. The way it works is straightforward: you include the ScrollReveal script on your page, then tell it which HTML elements to animate by passing a CSS selector (like a class name or tag) to the reveal() method. From that point on, whenever one of those elements enters the visible area of the browser window, the animation triggers automatically. You would use this when building a marketing site, portfolio, or landing page and you want a more polished, engaging experience without writing your own scroll-detection logic from scratch. It is a pure JavaScript solution with no framework required, just include it and call a function. The library is written in JavaScript, weighs under 6 kilobytes compressed, and can be installed via npm or loaded directly from a script tag in your HTML. It is licensed under the GPL for open-source and non-commercial projects, with a paid commercial license available.
Generated 2026-05-18 · Model: sonnet-4-6 · Verify against the repo before relying on details.