Forever Grid

What is Forever Grid

Forever Grid is a one-of-a-kind grid built with GLSL and Three.js with infinite scroll, zoom in and out, harnessing the power of shaders to create a distortion effect that feels natural and organic.

Main features

Responsive Layout – Fully responsive and adaptable regardless of which device is used.

Desktop & Mobile Optimized – Organic Slider will adapt to any screen size and any device, wheater you are using a mobile phone (IOS, Iphone, Android) or on your desktop browser.

Lazy Scrolling/Loading – Option to initialize Organic Slider on scroll when the slider is visible in the page, this way for example if the slider is in a section that is not visible it will not be initialized, instead Organic Slider will be initialized only when the user will scroll to the section in which the slider is added.

Customizable Size – OS can be set to any width or height and placed anywhere on your page or app. Additionally, items size and ratio can be set as needed.

Multiple Display Types – The slider can be displayed using a responsive layout or an “afterparent” mode, which allows it to adapt based on the size of the parent element.

Preloader – Optional animated preloader.

Parallax – Optional parallax scrolling effect.

Infinite Loop – Infinte or non-infinte grid..

Mouse Wheel or Gesture Zoom – The grid can be configured to zoom in and out using the mouse wheel or touch gestures. You can set the maximum and minimum zoom levels, as well as the initial zoom level when the grid is first displayed.

Item & Media Offset – Enable an optional offset for items or media when dragging the grid—this offset is dynamically adjusted based on the drag speed.

Customizable Item Scale And Gap – The minimum and maximum scale of items, as well as the gap between them, can be set.

Auto Scroll – Enable optional horizontal auto-scroll and vertical auto-scroll, each with customizable speed settings.

Limit Drag Direction – Constrain drag direction to horizontal or vertical.

Item Noise Animation – Optional item noise animation, the items will add a flag like customizable animation, example here.

Scroll speed strength – Customizable scroll speed – Fine-tune the scroll speed to match your desired experience.

Scroll scale strength – Customizable scroll scale – Fine-tune the scroll scale to match your desired experience.

Fluid Post-Processing effect – Intro fluid effect, example here.

Post Processing – Various post-processing effects, mouse ripple, fluid distortion, noise distortion, grid distortion, afterimage, bulge and more.