<script src="//unpkg.com/@fylgja/snap-slider" defer></script>
 
<snap-slider>
    <div data-track class="snap scroll-x flex gap">
        Slides...
    </div>
</snap-slider>
 

Custom Element Snap Slider

Add slide

Powered by <snap-slider> Or view the AlpineJS version

Meet snap-slider, an custom html element that enhances native CSS scroll snap sliders. Wrap the snap-slider around your scroll container to add features like next/prev buttons and pagination.

See the full details on fylgja.dev.

More Slider/Carousel examples are found on the UI Components on Fylgja.dev