Skip to content

component

loaderlogo

By Viper Guy

Details

Summary

First impressions load in under 3 second

Description

What it does LogoPreloader covers your page on load, animates your logo in with a smooth upward fade, holds it center-stage while a hairline progress bar sweeps the bottom edge, then dissolves everything in a signature blur-scale exit — revealing your site underneath. What's included Drop in your own PNG logo via Framer's native Image picker. No code editing required. An optional text block lets you pair a wordmark or tagline below the image. Every visual detail — accent color, background, image dimensions, and display duration — is controllable straight from the properties panel. Built for professionals Designed for agency sites, portfolios, and product launches where the first second matters. The animation sequence is hand-tuned with custom cubic-bezier curves for an entrance that feels intentional, not canned. The blur-out exit is the kind of detail clients notice without knowing why. Property controls — Logo Image (PNG, any size) — Image Width & Height — Show Text toggle (optional wordmark + subtext) — Accent Color — Background Color — Duration (1200ms – 6000ms) Setup in 60 seconds Add the component to your page → connect your logo PNG → publish. Works as a page overlay or fixed layer. No dependencies, no external libraries.

Introduction

First impressions load in under 3 second

Rank history

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

125015001750186228/148/228/309/79/15
  • All · #8622