Gsap Instruction

1. Where the Code Is Located

All scripts are inside Page Settings → Before </body> tag.
In Webflow:
Open the page.
Click Page Settings.
Scroll to Custom Code.
Find the code inside Before </body> tag.
You will see the full script block there.

2. Smooth Scrolling (Lenis)

Smooth scrolling is automatically enabled on desktop devices only.

if (!window.matchMedia("(min-width: 768px)").matches) return;

Change Scroll Speed

const lenis = new Lenis({
  duration: 0.9
});
3. Text Reveal Animation

Any text with the class:

.reveal-type

will animate when scrolling.

<h2 class="reveal-type">
Amazing digital experiences
</h2>
4. Counter Animation

Numbers automatically animate when they enter the viewport.

Required Structure

<div class="counter" data-target="120">
0
</div>
5. Animation Trigger Position

Animations start when the element reaches:

Required Structure

start: "top 80%"
6. Best Practice

If you duplicate sections in Webflow:
Keep the same classes
Do not duplicate the script
The script should remain only once in the page settings.