Create a premium loading experience with animated typography, layered image reveals, a progress bar, and a cinematic page transition.
Haytham Preloader animates your name into view, reveals a sequence of images, reduces the title to a custom two-letter mark, then reveals the page underneath. Typography, imagery, colors, spacing, timing, and animation settings are customizable directly in Framer.
Perfect for portfolios, agencies, fashion brands, photographers, architecture studios, personal websites, and premium landing pages.
Animated letter-by-letter name reveal
Layered image sequence
Animated progress bar
Custom supporting text
Custom two-letter final mark
Name and final-letter spacing controls
Custom typography and colors
Adjustable animation timing
Optional post-reveal hero text
Scroll-lock controls
Responsive across desktop, tablet, and mobile
No code required
Final Letters determines which two non-space characters remain.
For “Haytham Wali,” 0 = H and 7 = W.
HW Gap controls spacing between the final letters.
Name Spacing controls spacing for the animated name.
Image width and height can be adjusted independently.
Place the component once on the page where the preloader should run.
Name, typography, letter spacing, supporting copy, images, image size, colors, animation timing, letter motion, final mark, scroll locking, and optional reveal text.
Questions? Reach out at hasanwali6890@gmail.com
All sales are final upon purchase as this is a non-tangible digital product. A refund is offered only if the component suffers 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.
Create a premium loading experience with animated typography, layered image reveals, a progress bar, and a cinematic page transition.
Haytham Preloader animates your name into view, reveals a sequence of images, reduces the title to a custom two-letter mark, then reveals the page underneath. Typography, imagery, colors, spacing, timing, and animation settings are customizable directly in Framer.
Perfect for portfolios, agencies, fashion brands, photographers, architecture studios, personal websites, and premium landing pages.
Animated letter-by-letter name reveal
Layered image sequence
Animated progress bar
Custom supporting text
Custom two-letter final mark
Name and final-letter spacing controls
Custom typography and colors
Adjustable animation timing
Optional post-reveal hero text
Scroll-lock controls
Responsive across desktop, tablet, and mobile
No code required
Final Letters determines which two non-space characters remain.
For “Haytham Wali,” 0 = H and 7 = W.
HW Gap controls spacing between the final letters.
Name Spacing controls spacing for the animated name.
Image width and height can be adjusted independently.
Place the component once on the page where the preloader should run.
Name, typography, letter spacing, supporting copy, images, image size, colors, animation timing, letter motion, final mark, scroll locking, and optional reveal text.
Questions? Reach out at hasanwali6890@gmail.com
All sales are final upon purchase as this is a non-tangible digital product. A refund is offered only if the component suffers 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.
Hasan Wali
