Haytham Preloader v7

About this Component

Create a cinematic entrance with animated copy, a moving percentage counter, layered image reveals, grain, and a fullscreen final expansion.

Haytham Preloader introduces your site through five timed images, progressive counter movement, animated supporting lines, and a final image that expands to fill the viewport. Scrolling is locked during the sequence and restored automatically when the animation completes.

Perfect For

Creative portfolios Fashion and editorial websites Agencies Photography portfolios Campaign pages Product launches Premium landing pages

Key Features

Five-image reveal sequence Moving percentage counter Animated supporting copy Fullscreen final image expansion Automatic scroll lock during playback Optional replay control Animated noise/grain overlay Custom image fit and focal point Counter position, size, and X/Y offsets 9-point copy positioning Copy width, alignment, size, gap, and X/Y offsets Replay position and offset controls Custom fonts and colors Adjustable speed and start delay Responsive across desktop, tablet, and mobile Optimized static rendering No code required

How It Works

Five images reveal in sequence while the counter travels across the screen and the copy animates alongside it. The final image then expands into a fullscreen reveal. Page scrolling stays disabled during playback and is automatically restored once the sequence finishes.

Customization Options

Upload your own images, change typography and colors, position the counter and copy, adjust image sizing and focal point, customize the replay control and grain, and fine-tune the timing directly inside Framer.

Questions? Reach out at hasanwali6890@gmail.com

Refund Policy

All sales are final. Refunds are only available if the component has a technical issue that prevents it from working as described and I’m unable to resolve it. Refund requests must be made within 14 days of purchase and include clear evidence of the issue.