CircularPreloader

Show Preview
CircularPreloader
CircularPreloader

About CircularPreloader

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.

From Tim Yeng

Arc Carousel
Crisp Slider
Spatial Carousel
Stack Deck

Related Components

Counting loader
Preloader
Mask Preloader
Preloader Pro V2