Make the first second of your site unforgettable. Push Preloader is a full-screen loading screen for Framer where a character shoves a panel across the screen and reveals your big title behind it. It is playful, bold and takes minutes to set up, with no code.
Why it sells your site
A preloader is the first thing every visitor sees. Instead of a spinner, they get a small story: someone working hard to open your site. It sets the tone, builds anticipation and makes your brand feel crafted.
Pick any character
Choose from three built-in illustrated characters (Pusher, Robot and Blob), upload your own PNG or SVG, or type any emoji, letter or symbol and let it do the pushing.
Control the push
Set how fast each push is and how long the pause between pushes lasts, or fit everything into one total time. Add pause variation so it feels human, and Unevenness for irregular bursts. Choose easing, start delay, lean and bob. Push left or right.
Loads with your page
Turn on Wait for load and the last push holds until your page has actually finished loading, with a max-wait cap so visitors are never stuck.
Four ways to finish
Hold the full screen for a moment, then exit with Slide up, Slide away, Wipe or Fade. Set the exit time and easing to match your site.
Make it yours
Edit both title lines, pick any font, and set size, line height and letter spacing. Change the title, panel and backdrop colors. Add an optional percentage counter. Everything is a property, so you never open the code.
Built for real sites
Show it once per session so returning visitors skip it. Lock scroll while it runs. It always sits on top of your page, with a Z-index fallback. It respects reduced-motion settings, and an onComplete event lets you trigger your hero animations the moment it ends.
Design with confidence
A Canvas Preview slider lets you scrub to any frame while you design.
How to use
Add the component to the top of your page, give it a full-size frame and customize the properties.
