Instructions

The following instructions goes through the custom code and Javascript libraries used in this template.

01 - Smooth scrolling

The smooth scrolling library used for this template is called Lenis. It's a fairly new smooth scrolling library that works perfectly together with native Webflow interactions.

If you don't like this effect, feel free to remove it by deleting the custom code from the body-tag in the site settings.

02 - Parallax image effects

The library used for all parallax image effects in this template is called Ukiyo.js. This effect affects all image elements with the class "Parallax".

This makes it super easy to apply the effect to new image elements by giving them the same class of "Parallax".

Just as the smooth scrolling library, you're able to disable this effect by removing the setup code from the body-tag in the site settings.

03 - Sliders

The Javascript library used for sliders in this template is called Splide.js. You'll find the initialization code in the homepage body-tag settings, and the setup code inside embeds for each project collection item on the homepage.

There are a lot of options you're able to modify in order to customize the sliders further. Read more about Splide.js on its documentation page.

04 - Word & Letter Animations

The word- and letter animations are created using a small Javascript package created by Waveshape called WordPlay. It's really simple to use, and you're able to find the initialization and setup code in the site settings body-tag code.

05 - Responsive menu on mobile

In the site settings body-tag custom code, there's a small script that makes sure that the responsive menu closes on mobile after a click on any of the nav links.