---
title: "CircularPreloader — Free Framer component · Best of Framer"
description: "Free Framer component · by Tim Yeng · Loaders. Animated Circular Preloader"
canonical: "https://framer.elliotli.dev/component/circularpreloader"
---

[Home](/)/[Components](/components)/[Loaders](/components/category/loaders)/CircularPreloader

# CircularPreloader

Animated Circular Preloader

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

![CircularPreloader preview image 1](https://framer.elliotli.dev/og/component/circularpreloader/b8cea30251fe296a/1600x1200.jpg)

## Summary

Animated Circular Preloader

## Description

The **Circular Preloader** turns waiting time into a moment of brand storytelling. This versatile component works in two powerful ways:

1.  **As a Preloader:** Set it to cover the screen. It runs a percentage timer and then performs a stylish "curtain wipe" exit (sliding up, down, or sideways) to dramatically reveal your website.
    
2.  **As a Design Element:** Turn off the background and loading features to create a beautiful, rotating text badge. Place it in your Hero section, use it as a dynamic "sticker," or add it to your footer.
    

**Key Features**

-   **Spinning Text Rings:** Add multiple circles of text that rotate at your chosen speed and direction.
    
-   **Curtain Reveals:** Automatically wipes away (slides up, down, etc.) when loading finishes.
    
-   **Live Percentage Timer:** A sleek counter that goes from 0% to 100% (optional).
    
-   **Smart Layout:** Rings automatically adjust their spacing based on your font size—no math required.
    
-   **Fully Customizable:** Adjust fonts, colors, sizes, and animation speeds directly in the sidebar.
    

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

-   All · #3606

## Details

- **Author**: Tim Yeng
- **Published**: 2026-01-12
- **Updated**: 2026-02-22
- **Added**: 2025-12-22
- **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