---
title: "Story Slider — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Ahmet Loca · Carousels. story slider for Framer: showcase images and videos with 8 transition effects (fade, zoom, iris, dissolve)."
canonical: "https://framer.elliotli.dev/component/story-slider"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/Story Slider

# Story Slider

Cinematic Image Slider

[View on Framer](https://framer.com/marketplace/components/story-slider/?via=elliot-li)

![Story Slider preview image 1](https://framer.elliotli.dev/og/component/story-slider/6e8fc1d15bfef26f/1600x1200.jpg)

## Summary

story slider for Framer: showcase images and videos with 8 transition effects (fade, zoom, iris, dissolve).

## Description

**MORE FRAMER COMPONENTS LIKE THIS**

**✦ Browse +38 FREE + 85 premium components:** [**https://frameze.com/components**](https://frameze.com/components)

**✦ Carousel Bundle:** [**https://frameze.com/components/category/carousels?ref=bundles**](https://frameze.com/components/category/carousels?ref=bundles)

## About Story Slider

Instagram-style story slider for Framer: showcase images and videos with 8 transition effects (fade, zoom, iris, dissolve). Includes autoplay, progress bars, captions, CTA buttons, and thumbnail navigation. Fully customizable and mobile-responsive.

Iris, Morph, Dissolve, Zoom & More. Auto-play, Progress Bars & Thumbnail Navigation. Fully Customizable Typography & Demo Mode. No WebGL Required.

**Features için madde madde:**

-   Eight Canvas 2D transitions — fade, slide, wipe, zoom, iris, bars, morph & dissolve
    
-   Built-in demo mode with visual effect picker — switch transitions live on screen
    
-   Auto-play with configurable slide duration per story
    
-   Progress bar indicators with clickable navigation
    
-   Thumbnail strip — vertical or horizontal, fully positionable
    
-   CTA button per slide with custom link, color & border radius
    
-   Label & sublabel per slide with independent font family controls
    
-   Left/right arrow navigation — smart offset when thumbnails are active
    
-   Loop & autoplay toggle
    
-   Touch swipe support for mobile
    
-   Keyboard navigation — arrow keys & spacebar
    
-   Video & image support per slide with mute control
    
-   No WebGL, no GSAP, no external dependencies — pure React & Canvas 2D
    

**Use Cases:**

-   Fashion campaigns
    
-   Editorial portfolios
    
-   Product showcases
    
-   Agency hero sections
    
-   Brand stroytelling
    
-   Photography galleries
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #4857

## Details

- **Author**: Ahmet Loca
- **Price**: $5.00
- **Published**: 2026-06-26
- **Updated**: 2026-09-29
- **Added**: 2026-06-26
- **Categories**: Carousels

## More like this

-   [3DCurvedImageMarquee](/component/3dcurvedimagemarquee) — Lera · $4 — Curved perspective double ticker
-   [Orbit Kit Carousel](/component/orbit-kit-carousel) — Khairul Fauzy Khairudin · $12 — 3D drag carousel with inertia
-   [Team Orbit](/component/team-orbit) — Ali Musa · Free — Interactive Team Showcase
-   [Glow Testimonial](/component/glow-testimonial) — Interface Studio · Free — Testimonials with a Little Glow