Webflow cloneable · Slider

Swiper.js Cards Slider Webflow cloneable

Create captivating Swiper.js cards slider with this Webflow cloneable by Timothy Ricks. Perfect for hero sections or features, easily navigate between slides with seamless transitions. Integrate Swiper.js with Webflow CMS for dynamic content display. Customizable features enhance user experience.

Swiper.js Cards Slider on a desktop screen
Swiper.js Cards Slider on a phone
Screenshots of the live preview, Nov 7, 2026 Open live preview

About cloneable

This Webflow cloneable by Timothy Ricks enables users to create a visually stunning Swiper.js overlapping cards slider. Ideal for hero sections or feature displays, this slider allows for seamless navigation between slides, where each card transitions smoothly, revealing the next image and corresponding text. By integrating Swiper.js with Webflow's CMS collections, users can dynamically populate slides based on collection list items. Customizable features such as grab cursor, looping, and arrow navigation enhance user experience. This cloneable offers a sophisticated and interactive way to showcase content, making it a valuable addition for any Webflow user looking to elevate their website design.

This code initializes two Swiper instances, one for photos and one for content, and sets up a controller for each instance to control the other. The code also includes CSS to display the Swiper slide for photos.

About custom code

This code initializes two Swiper instances, one for photos and one for content, and sets up a controller for each instance to control the other. The code also includes CSS to display the Swiper slide for photos.

JS libraries

Similar cloneables

All Slider cloneables →
WeBlocks CMS Swiper Slider
WeBlocks CMS Swiper Slider Create dynamic and engaging websites with this WeBlocks CMS Swiper Slider Webflow cloneable. Easily navigate sliders with Slider Navigation and enjoy crisp, antialiased fonts for a seamless user experience. Optimize your site with this versatile tool.
Clone
Draggable Swiper.js slider
Draggable Swiper.js slider Enhance your website with this Swiper.js slider Webflow cloneable. Choose from three unique carousel slider designs with customizable settings for optimal performance and seamless integration with Webflow's CMS collection. Elevate your site's user experience with this dynamic and interactive slider solution.
Clone
Swiper.js CMS Sliders
Swiper.js CMS Sliders Elevate your Webflow projects with CMS Sliders using Swiper.js Webflow cloneable. Eight dynamic slider options available for seamless integration with Webflow CMS. Enhance user engagement and creativity on your website.
Clone
Swiper.js Dynamic CMS Slider
Swiper.js Dynamic CMS Slider Enhance your website with this CMS driven Swiper.js dynamic slider Webflow cloneable. Create engaging sliders with smooth transitions, synchronized control, scroll interactions, and customizable text properties. Ideal for showcasing dynamic content with Webflow CMS items.
Clone
Overlapping Stacking Card CMS Slider
Overlapping Stacking Card CMS Slider Enhance your website with the Overlapping Stacking CMS Slider Webflow cloneable. Create visually appealing sliders with custom CMS elements and unique stacking effects. Perfect for showcasing products and services, this fully responsive slider boosts user engagement. Customize your website with this versatile and dynamic tool.
Clone
Looping Swiper.js Carousel Slider
Looping Swiper.js Carousel Slider Create a responsive Swiper.js carousel slider with navigation arrows, keyboard, and mousewheel control using this Webflow cloneable. Customizable features include swipe speed, full-screen layout, centered slides, and pagination. Optimize your website's user experience with this easy-to-use template.
Clone
Swiper.js Scroll into View Animation
Swiper.js Scroll into View Animation Enhance user engagement with the Swiper slider lectures animations Webflow cloneable by Halo Lab. Draggable, smooth transitions, speed control, and responsive design for dynamic content showcasing. Perfect for adding interactive elements with captivating animations for a modern website UX.
Clone
Swiper.js Carousel
Swiper.js Carousel Enhance user engagement with a Swiper carousel Webflow cloneable. Create a dynamic slider with rotation, depth, and more. Curated by CJ Hersh, this cloneable elevates the user experience on your site.
Clone