Skip to content

component

CinematicSlideshow

By piyush vichare

Details

Summary

Create immersive visual stories fast

Description

Cinematic Slideshow Cinematic Slideshow is a premium Framer component built for modern storytelling and immersive visual experiences. It features smooth autoplay transitions, clickable progress navigation, cinematic image animations, customizable text effects, and full typography controls. Perfect for portfolios, real estate, fashion, agencies, and landing pages, the component helps you create elegant and interactive slideshow sections with minimal setup. Features Smooth autoplay slideshow Clickable progress navigation Multiple image effects Multiple text animations Unlimited font customization Responsive layout Marketplace optimizedHow to Use 1. Add the Component Drag the Cinematic Slideshow component onto your Framer canvas. 2. Add Slides Inside the properties panel: Open: Slides Then add: Image Title Each slide contains: One image One title Example: Slide 1 → Modern Villa Slide 2 → Luxury Interior Slide 3 → Urban Living 3. Customize Typography Open:Font You can fully customize: Font family Font size Weight Spacing Line height This uses Framer’s native font controls, so all installed Framer fonts work automatically. 4. Change Image Animation Open:Image Effect Available options: Fade Zoom Slide Up Slide Left This controls how images transition between slides. 5. Change Text Animation Open:Text Effect Available options: Fade Slide Up Zoom Blur This controls how the slide titles animate. 6. Adjust Duration Open:Duration Controls how long each slide stays visible before moving to the next slide. Example: 2 → fast transitions 4 → balanced timing 8 → slower cinematic feel 7. Adjust Border Radius Open:Radius Controls slideshow corner roundness. Example: 0 → sharp corners 20 → modern rounded layout 50+ → soft card style Interaction Behavior Autoplay Slides automatically move to the next slide after the selected duration. Progress Navigation Clicking on a progress bar instantly changes slides. Smooth Timing Reset When users manually change slides: Autoplay restarts correctly Progress timing resets smoothly No animation jump occurs Tips for Best Results Use High Quality Images Cinematic transitions look best with premium visuals. Keep Titles Short Shorter titles create a cleaner cinematic feel. Match Animation Style to Brand Zoom → premium luxury feel Fade → minimal modern feel Slide → dynamic energetic feel Use Consistent Aspect Ratios Consistent image dimensions improve visual smoothness.

Introduction

Create immersive visual stories fast

Rank history

Daily rank per list, from the first snapshot — lower is better.

12515017518178/148/228/309/79/15
  • All · #647