---
title: "Scroll Image Reveal | FramerHub"
canonical_url: "https://framerhub.io/components/scroll-image-reveal"
last_updated: "2026-06-15T14:46:31.551Z"
meta:
  description: "Create cinematic scroll-triggered image reveals with organic displacement effects and smooth animations. Premium Framer component for client sites,."
  "og:description": "Create cinematic scroll-triggered image reveals with organic displacement effects and smooth animations. Premium Framer component for client sites,."
  "og:title": "Scroll Image Reveal | FramerHub"
---

# **Scroll Image Reveal **

Create cinematic scroll-triggered image reveals with organic displacement effects and smooth animations.

One-time payment

Lifetime updates

Commercial license

## **Overview** Create cinematic scroll-triggered image reveals with organic displacement effects and smooth animations. - Four stunning reveal effects (Circle, Circle Morph, Circle Blur, Wave Path) - Scroll-triggered animations with smooth scrubbing - Full control over reveal timing and easing - Customizable displacement and filter effects - Optional transform animations (position, scale, rotation) - Performance-optimized with GPU acceleration - Works in any section or layout - Zero coding required ## Cinematic Image Reveals for Framer Transform static images into dynamic scroll experiences. Four organic reveal effects with full control over timing, easing, and visual impact. Built for designers who need portfolio-grade animations without touching code. ## Features**Four Reveal Effects** Circle, Circle Morph, Circle Blur, or Wave Path—each creates a unique organic reveal as users scroll.**Complete Animation Control** Set when reveals start and end, adjust smoothness, choose from 30+ easing curves, and add optional delays.**Advanced Visual Effects** Customize displacement intensity, blur amounts, morphology, and brightness transitions for your exact vision.**Transform Animations** Add position shifts, scaling, or rotation at the start and end of your reveal for extra dimension.**Performance First** GPU-accelerated animations run smoothly at 60fps. Lazy loading ensures fast page loads. ## Use Cases**Portfolio Hero Sections** — Make striking first impressions with images that reveal as visitors scroll**Product Photography** — Showcase products with cinematic reveals that feel premium and polished**Case Study Pages** — Draw attention to key visuals with dynamic scroll-based reveals**About Pages** — Add personality with images that come alive as users explore your story**Landing Pages** — Elevate conversion rates with engaging scroll interactions that feel modern![Scroll Image Reveal Preview](https://framerhub.io/framerhub/img/components/control/scroll-image-reveal.jpg) ## How to Use ### Installation After purchasing from FramerHub: 1. Log in to your account at framerhub.io 2. Navigate to framerhub.io/dashboard 3. Find Scroll Image Reveal in your Recent Purchases 4. Click the "Copy" button 5. Open your Framer project 6. Paste the component anywhere on your canvas (Cmd/Ctrl + V) ### Customization All settings are in Framer's properties panel:**Image & Display**- Upload your image or paste an image URL - Set image dimensions and object fit (cover, contain, fill)**Reveal Effect**- Choose from 4 effects: Circle, Circle Morph, Circle Blur, Wave Path - Adjust final reveal size and displacement intensity - Control blur amount and morphology for enhanced effects**Animation Timing**- Set start and end scroll triggers - Adjust smoothness (lower = smoother scrubbing) - Choose from 30+ easing options - Add optional animation delay**Transform (Optional)**- Set starting position, scale, and rotation - Define ending position, scale, and rotation - Create complex multi-dimensional animations ### Quick Tips**Timing Matters** — Start reveals early (top bottom) for gradual builds, or late (center bottom) for impact**Easing Choice** — Use "none" for smooth linear reveals, or "power2.out" for snappier finishes**Image Size** — Larger images need higher final radius values (800+) for complete reveals**Layering** — Place text or overlays above the component for rich, layered compositions ## License**Single Use License** — Use in one client project with full commercial rights. No redistribution. 1 license = 1 client. ## Why Designers Choose This Four ready-to-use effects give you a professional starting point, then every parameter is yours to control. From subtle reveals to dramatic transformations, you get the exact animation you envision—all through Framer's familiar properties panel. Perfect for designers building portfolio sites, agencies delivering premium client work, and freelancers who want standout scroll experiences. --- ### **Scroll Image Reveal - $12** Create cinematic scroll-triggered image reveals with organic displacement effects and smooth animations.**One-Time Payment****Lifetime Access****Unlimited sites**### **You might also like** Why Choose Framer Hub Components ## **Loved by Framer teams** Used by Framer professionals who need premium, no-code experiences. Got questions? We've the answers ## **Got questions? We've the answers ** Everything you need to know about FramerHub.