---
title: "Omni Curve Preloader — Framer component · Best of Framer"
description: "$6.00 · Framer component · by Shouvik Biswas · Loaders. Fluid Multi-Axis Mask Preloader"
canonical: "https://framer.elliotli.dev/component/omni-curve-preloader"
---

[Home](/)/[Components](/components)/[Loaders](/components/category/loaders)/Omni Curve Preloader

# Omni Curve Preloader

Fluid Multi-Axis Mask Preloader

[View on Framer](https://framer.com/marketplace/components/omni-curve-preloader/?via=elliot-li)

![Omni Curve Preloader preview image 1](https://framer.elliotli.dev/og/component/omni-curve-preloader/741883e1fc4f0399/1600x1200.jpg)

## Summary

Fluid Multi-Axis Mask Preloader

## Description

A high-fidelity preloader utilizing a unified SVG masking engine to execute fluid, cinematic reveals. Engineered to transition seamlessly from a precise loading slit into a continuous, omnidirectional curve wipe.

## Features

-   Customizable solid overlay for establishing the initial baseline brand canvas.
    
-   Adjustable slit thickness for fine-tuning the visual weight of the initial loading state.
    
-   Multi-axis motion routing (Horizontal, Vertical, Diagonal) for aligning the reveal with specific layout geometry.
    
-   Dynamic origin points (Edge or Center) for dictating the spatial direction and focal point of the wipe.
    
-   Staggered multi-layer echo trails for adding visual momentum and spatial depth to the transition.
    
-   Independent trail color assignments for integrating complex brand palettes directly into the motion path.
    
-   Dedicated loading transition controls for dictating the speed, easing, and rhythm of the initial line entrance.
    
-   Independent curve transition controls for pacing the final dimensional reveal sequence.
    
-   Unified SVG path architecture for eliminating sub-pixel rendering artifacts and overlapping edge bleeds.
    
-   Dynamic bounding box tracking for maintaining exact mathematical thickness proportions across varying viewport sizes.
    
-   Continuous keyframe interpolation for ensuring zero momentum loss during center-origin expansions.
    
-   Automated pointer-event routing for preventing accidental user interactions during the active loading phase.
    
-   Canvas-aware static rendering for maintaining clean visibility and stability while editing within Framer.
    

## How to Use

-   Drag and drop the component onto your Framer canvas.
    
-   Set Position to Fixed and resize it to fit your layout.
    
-   Set Pointer Events to None under the Styles panel.
    
-   Customize the motion and styling properties to match your design.
    
-   Publish your project to view the component live.
    

_Transform the standard page load into a composed visual sequence._

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

-   All · #5200

## Details

- **Author**: Shouvik Biswas
- **Price**: $6.00
- **Published**: 2026-07-07
- **Updated**: 2026-08-08
- **Added**: 2026-07-07
- **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
