This website requires JavaScript to deliver the best possible experience.

A simple responsive
carousel.

Hooper lets you create beautiful carousel sliders that scale well in different sizes, with multiple configurations and settings to come up with your very own image slider.

Features

Lightweight

Built using vanilla JavaScript. No jQuery, no dependencies.

Fully responsive

Enjoy Hooper on multiple view ports and different scenarios, as it scales well in different sizes.

Touch support

Designed with mobile devices in mind as well as mouse dragging action for desktops.

SVG ready

Hooper works with SVGs for custom navigation icons as well to provide an even smoother experience.

Smooth transitions

Hooper provides a smooth transition experience between sliders, and you can set your own transitions as well.

Cross-browser compatibility

Hooper is compatible with all browsers and provides the same consistent experience.

Installation
and Usage.

npm install hooper
# or use yarn
yarn add hooper

# Usage
<template>
  <hooper>
    <slide>
      slide 1
    </slide>
    <slide>
      slide 2
    </slide>
    ...
  </hooper>
<template>

<script>
  import { Hooper, Slide } form 'hooper';

  export default {
    name: 'App',
    components: {
      Hooper,
      Slide
    }
  }
</script>

Swipe images
with ease.