Swiper Demos

You can download all these demos and hook into the code from GitHub here

Default Setup

Open in new windowSource codeEdit in Stackblitz

Navigation

Open in new windowSource codeEdit in Stackblitz

Pagination

Open in new windowSource codeEdit in Stackblitz

Pagination / Dynamic Bullets

Open in new windowSource codeEdit in Stackblitz

Progress Pagination

Open in new windowSource codeEdit in Stackblitz

Fraction Pagination

Open in new windowSource codeEdit in Stackblitz

Custom Pagination

Open in new windowSource codeEdit in Stackblitz

Scrollbar

Open in new windowSource codeEdit in Stackblitz

Vertical Slider

Open in new windowSource codeEdit in Stackblitz

Space Between Slides

Open in new windowSource codeEdit in Stackblitz

Multiple Slides Per View

Open in new windowSource codeEdit in Stackblitz

Auto Slides Per View / Carousel Mode

Open in new windowSource codeEdit in Stackblitz

Centered Slides

Open in new windowSource codeEdit in Stackblitz

Centered Slides + Auto Slides Per View

Open in new windowSource codeEdit in Stackblitz

CSS Scroll Snap (CSS Mode)

Open in new windowSource codeEdit in Stackblitz

Free Mode / No Fixed Positions

Open in new windowSource codeEdit in Stackblitz

Scroll Container

Open in new windowSource codeEdit in Stackblitz

Multi Row Slides Layout

Open in new windowSource codeEdit in Stackblitz

Nested Swipers

Open in new windowSource codeEdit in Stackblitz

Grab Cursor

Open in new windowSource codeEdit in Stackblitz

Loop Mode / Infinite Loop

Open in new windowSource codeEdit in Stackblitz

Loop Mode with Multiple Slides Per Group

Open in new windowSource codeEdit in Stackblitz

Fade Effect

Open in new windowSource codeEdit in Stackblitz

3D Cube Effect

Open in new windowSource codeEdit in Stackblitz

3D Coverflow Effect

Open in new windowSource codeEdit in Stackblitz

3D Flip Effect

Open in new windowSource codeEdit in Stackblitz

Keyboard Control (Open in new window)

Open in new windowSource codeEdit in Stackblitz

Mousewheel Control

Open in new windowSource codeEdit in Stackblitz

Autoplay

Open in new windowSource codeEdit in Stackblitz

Dynamic Slides

Open in new windowSource codeEdit in Stackblitz

Thumbs Gallery

Open in new windowSource codeEdit in Stackblitz

Thumbs Gallery With Loop Mode

Open in new windowSource codeEdit in Stackblitz

Hash Navigation (Open in new window)

Open in new windowSource codeEdit in Stackblitz

History API (Open in new window)

Open in new windowSource codeEdit in Stackblitz

RTL Layout

Open in new windowSource codeEdit in Stackblitz

Parallax

Open in new windowSource codeEdit in Stackblitz

Lazy Loading Images

Open in new windowSource codeEdit in Stackblitz

Responsive Breakpoints (Open in new window)

Open in new windowSource codeEdit in Stackblitz

Auto Height

Open in new windowSource codeEdit in Stackblitz

Zoom

Open in new windowSource codeEdit in Stackblitz

Virtual Slides

Open in new windowSource codeEdit in Stackblitz

Slideable Navigation Drawer

Open in new windowSource codeEdit in Stackblitz

Ratio breakpoints

Open in new windowSource codeEdit in Stackblitz

Change direction

Open in new windowSource codeEdit in Stackblitz

Watch slides visibility

Open in new windowSource codeEdit in Stackblitz

Custom plugin

Open in new windowSource codeEdit in Stackblitz