This component is a preload animation that displays your logo at the center on page load, then smoothly transitions into the hero section for a strong, branded first impression.

-About this Component Preload Animation is a Framer preload animation component designed to deliver a polished and memorable first impression when users open your website.

When the page loads, your logo appears in the center of the screen with a smooth animation. Once the logo animation is complete, the first-view (hero) section scrolls up from the bottom, seamlessly revealing the top of your homepage.

-Customization Logo replacement

Easily replace the logo with your own SVG file

Ideal for brand logos and symbols

Color control

Background color can be customized

Logo color can be customized

Default setup uses a black background with a white logo

Animation settings

Adjust the speed of the logo animation

Adjust the scroll-up transition speed

Fine-tune the overall timing to match your design