Animation Engine

Preloader

A full-screen loading screen shown until the page is ready, then animated away — 16 styles from a simple spinner to a counter, progress ring, curtain reveal or your logo. One site-wide setting; supersedes the theme’s basic preloader when the engine is active.

One switch, 16 styles

A polished first impression.

The Preloader covers the page while it loads, then reveals the content with an exit animation — enable it in Unyson+ → Extensions → Animation Engine → Preloader and pick a style. Since it plays on page load, the styles are shown below rather than run here.

Spinners & loaders

Shown while the page loads

Spinner

Dual Ring

Dots

Dots Fade

Orbit

Bars

Grid

Pulse

Progress & reveals

Counters, rings, curtains & your logo

Ripple

Square

Bar

Progress Ring

Counter

Curtain

Gradient

Logo

How to set it up

Add it in under a minute

  1. Open Unyson+ → Extensions → Animation Engine → Preloader.
  2. Turn it on and pick one of the 16 styles.
  3. Set its colours, and for the Logo style upload your mark.
  4. Save — it shows on load, then animates away when the page is ready.

Free & open source

Build with this element, free.

Install the framework and the Bootstrap 5 theme, then drag this element into any page.