Repolode
Submit
nolimits4web

nolimits4web/swiper

Free, touch-first JavaScript slider for mobile websites and apps, with hardware-accelerated transitions and no jQuery dependency.

View on GitHubWebsite
Stars
41,906
Forks
9,582
Open issues
247
Last commit
6 days ago

What is it?

Swiper is a JavaScript slider library focused on touch interaction for mobile websites, mobile web apps, and native or hybrid apps. It uses a flexbox-based slide layout, so slide sizes and grids can be controlled with CSS and a set of initialization parameters such as slides per view, slides per group, and spacing.

The library ships with built-in pagination, navigation arrows, and a scrollbar, and supports loop mode, autoplay, keyboard and mousewheel control, lazy loading of images, and virtual slides that keep only the needed slides in the DOM. Transition effects include fade, flip, 3D cube, and 3D coverflow. Multiple Swiper instances can control each other, and RTL layouts are supported.

Swiper is tree-shakeable, ships with TypeScript types, and is distributed through npm and jsDelivr. Its README points to official demos for Core, React, and Vue usage.

Key features

  • 01Touch-first slider with 1:1 touch movement that can be configured.
  • 02Flexbox slide layout with control over slides per view, groups, and spacing.
  • 03Built-in pagination, navigation arrows, and scrollbar.
  • 04Fade, flip, 3D cube, and 3D coverflow transition effects.
  • 05Lazy loading and virtual slides for image-heavy or large carousels.
  • 06Tree-shakeable modules with TypeScript types and no jQuery dependency.

Use cases

  • Building image galleries or product carousels on mobile-friendly websites.
  • Adding swipeable onboarding or banner sections to mobile web apps.
  • Creating multi-row or multi-column slide layouts with pure CSS configuration.
  • Linking a thumbnail slider with a main slider so they control each other.

Quick start

  1. 1

    Install Swiper from npm

    npm install swiper
  2. 2

    Build the development version (run in the repo root after cloning)

    npm install && npm run build
  3. 3

    Run the Core demo from the playground folder

    npm run core

Things to know

  • Not compatible with all platforms; it targets modern browsers and mobile apps only.

Topics

#carousel#slider#touch#mobile#javascript#typescript#ui-component#gallery#swipe#swiper

FAQ

What is swiper?
Free, touch-first JavaScript slider for mobile websites and apps, with hardware-accelerated transitions and no jQuery dependency. Swiper is a JavaScript slider library focused on touch interaction for mobile websites, mobile web apps, and native or hybrid apps. It uses a flexbox-based slide layout, so slide sizes and grids can be controlled with CSS and a set of initialization parameters such as slides per view, slides per group, and spacing.
Is swiper free to use? What license does it have?
swiper is open source under the MIT license. Check the license terms before using it in commercial products.
Is swiper still maintained?
Actively maintained. The last commit to swiper was on Oct 16, 2026.
What can I use swiper for?
Building image galleries or product carousels on mobile-friendly websites. Adding swipeable onboarding or banner sections to mobile web apps. Creating multi-row or multi-column slide layouts with pure CSS configuration. Linking a thumbnail slider with a main slider so they control each other.
How do I install swiper?
Install Swiper from npm: npm install swiper Build the development version (run in the repo root after cloning): npm install && npm run build Run the Core demo from the playground folder: npm run core
Where can I get swiper?
The source code and installation instructions are on GitHub: https://github.com/nolimits4web/swiper

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects