---
title: "Logo Pre-loader — Framer component · Best of Framer"
description: "$4.00 · Framer component · by Integry · Loaders. High-end cinematic intro for websites."
canonical: "https://framer.elliotli.dev/component/logo-pre-loader"
---

[Home](/)/[Components](/components)/[Loaders](/components/category/loaders)/Logo Pre-loader

# Logo Pre-loader

High-end cinematic intro

[View on Framer](https://framer.com/marketplace/components/logo-pre-loader/?via=elliot-li)

![Logo Pre-loader preview image 1](https://framer.elliotli.dev/og/component/logo-pre-loader/52772779d1fe28da/1600x1200.jpg)

## Summary

High-end cinematic intro for websites.

## Description

## Logo Animation Pro

**The ultimate cinematic intro sequence for high-end Framer websites.**

**Logo Animation Pro** is a production-ready "gatekeeper" component designed to create a sophisticated first impression. It acts as a professional loader that masks your website content with a solid background and a choreographed logo reveal before seamlessly transitioning into your live site.

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-b1bfrktf-yUJGIDCUThQvMl4boWU2jLbc4qYTc0)

### 🛠 How to Use

**1\. Placement:** Drag the component onto your homepage. Since it is coded with position: fixed, it will automatically cover the entire viewport regardless of its layer position.

**2\. Configuration:** Upload your logo and select a **Preset** that fits your brand. Adjust the **Background Color** to mask your site content effectively. Recommended to use Transparent PNG or SVG.

**3\. Refinement:** Fine-tune the timing. A **Hold Time** of **1.5s** is generally the "sweet spot" for brand recognition before the site is revealed.

**4\. Position:** Add the component in your layout template to show across all pages on your website. The component is not visible even if it's showing on the editor, the component layer won't show in the live website. Keeping the layout absolute in the layout template is recommended.

### Questions & Support

Free lifetime updates & email support. Questions? Reach out via email [**integrystudio@gmail.com**](mailto:integrystudio@gmail.com) or on [**LinkedIn**](https://www.linkedin.com/company/integrystudio).

### Setting Up

Need help setting up your website or integrating this component?

Reach out, and we’ll help get it running perfectly in your Framer project.

[**Demo**](https://integry.framer.ai/logopreloader)

## Rank history [How rankings work →](/terms#rankings)

-   All · #5506

## Details

- **Author**: Integry
- **Price**: $4.00
- **Published**: 2026-04-10
- **Updated**: 2026-09-11
- **Added**: 2026-03-25
- **Categories**: Loaders

## More like this

-   [Preloader Pro V4](/component/preloader-pro-v4) — Interface Studio · $12 — Your Website, Beautifully Unveiled
-   [Circleloader](/component/circleloader) — gustavwf · $5 — Circular logo reveal loader.
-   [AI Text Loading](/component/ai-text-loading) — Syauqizaidan Khairan Khalaf · $5 — Thinking phrases with a shimmer
-   [Preloader Pro V3](/component/preloader-pro-v3) — Interface Studio · $10 — Set the Stage Before the Story