Skip to content

component

Masked Gallery

By Hasan Wali

Details

Summary

Cinematic scroll image reveals

Description

About this Component Create a cinematic scrolling gallery where bold typography and full-screen imagery reveal together through smooth, scroll-driven motion. Each project transforms from an angled geometric crop into a full-frame image as it enters the viewport, while the title reveals character by character. As the section leaves, the image reshapes again for a continuous transition. Perfect For: • Creative portfolios • Agency and studio websites • Photography showcases • Fashion and editorial projects • Case studies • Product showcases • Experimental landing pages Key Features: • Scroll-driven image clip-path animation • Character-by-character title reveal • Add, remove, and reorder gallery items • Responsive image uploads • Custom typography, color, alignment, and casing • Adjustable title position and responsive font size • Image fit with X/Y focal controls • Adjustable section height and side padding • Text offset, stagger, reveal start, and distance controls • Adjustable image shape strength and transition length • Viewport-aware animation for better performance • Responsive across desktop, tablet, and mobile • Static-renderer support for reliable Framer previews • No external libraries required How It Works Add your images and titles from the Items control, then customize typography, layout, image framing, and animation directly in Framer. The component automatically drives the title reveal and image transformation based on each section’s position in the viewport. Questions? Reach out at hasanwali6890@gmail.com Refund Policy All sales are final as this is a non-tangible digital product. A refund is offered only if the component has a critical technical failure that prevents its core function and cannot be resolved within a reasonable timeframe. Refunds are not issued for buyer's remorse, aesthetic preference, or modifications made after purchase. Report confirmed technical failures with evidence within 14 days of purchase.

Introduction

Cinematic scroll image reveals

Rank history

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

125015001750180948/289/19/69/109/15
  • All · #7615