---
title: "Slider Studio — Free Framer component · Best of Framer"
description: "Free Framer component · by Harsh Works · Carousels. Slider Studio is a one-at-a-time snap carousel for Framer."
canonical: "https://framer.elliotli.dev/component/slider-studio"
---

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

# Slider Studio

A CMS snap carousel with FX

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

![Slider Studio preview image 1](https://framer.elliotli.dev/og/component/slider-studio/dac471a2fe796001/1600x1200.jpg)

## Summary

Slider Studio is a one-at-a-time snap carousel for Framer.

## Description

Slider Studio is a one-at-a-time snap carousel for Framer. Drop it on a hero, a products section, a testimonials block, or any place where one item should hold focus and the next should arrive cleanly. The transition and the hover treatment are fully in your hands.

Most sliders ship one transition. This one gives you seven, and an optional layer of WebGL hover effects on top.

### Seven transitions

-   **Slide**, a clean track with a neighbour peek.
    
-   **Fade**, a crossfade in place.
    
-   **Parallax**, the photo drifts inside the frame.
    
-   **Zoom**, the centre pushes in with inner parallax.
    
-   **Stack**, slides deal like a deck.
    
-   **Cards**, upcoming slides fan out behind.
    
-   **Flip**, each card turns in 3D.
    

### Optional WebGL hover effects

RGB Shift, Ripple, Zoom Lens, Glitch, Twist, Pixelate, and Shine. Turn one on and it plays on the centred image on hover, then clears the moment you leave. Built in raw WebGL, no dependencies, and invisible during drags and scrolls so they never fight the motion.

### Manual or CMS

Add slides by hand, each with an image or video, a poster, a caption, and a link, or drop a Collection List into the slot and it maps every row automatically, click through links included. It ships with Framer hosted placeholders, so it looks complete on drop in.

### Smooth by design

Drag has flick momentum, Scroll to Slide accumulates the wheel into an eased snap, and the easing is frame rate independent, so it feels the same on 60Hz and 120Hz.

### Controls

Grouped for clarity: Source, Layout, Motion, Navigation, Hover FX, and Style. Every control carries its own one line description in the panel.

### What you get

A snap carousel with seven transitions, seven optional WebGL hover effects, manual or CMS data, drag with momentum, arrows, dots, autoplay, smooth scroll, infinite loop, click through links, no npm dependencies, a calm static preview, and free updates within the version.

Made with 🖤 for [**Framer**](https://framer.link/harshupadhyay) by [**Harsh**](https://harsh.works/)

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

-   All · #1819

## Details

- **Author**: Harsh Works
- **Published**: 2026-07-09
- **Updated**: 2026-09-13
- **Added**: 2026-07-09
- **Categories**: Carousels

## More like this

-   [Screen Stage Mockup](/component/screen-stage-mockup) — Aisol Studio · $14 — Your screens in synced devices
-   [Team Reel](/component/team-reel) — Ali Musa · Free — Interactive Team Showcase
-   [Slider](/component/slider) — MAS · Free — A smooth, customizable slider.
-   [Cascade Card Slider](/component/cascade-card-slider) — Tim Yeng · Free — Cards that cascade into view