Skip to the content

Library/ 93 clock-wipeNewProTransitions & loaders

Clock Wipe

A colour sweeps round like a clock hand, then fills the screen.

A Pro component: the live demo and the code come with Pro.

Settings

Pro
  • color
  • startAngle
  • sweepShare
  • direction
Tune it live with Pro

What it does

Clock Wipe is a page transition ready for your AI assistant, React or plain JavaScript, with no dependencies. Also called clock reveal, radial wipe or pie wipe.

Scroll and a wedge of colour turns from twelve o'clock until it closes into a disc, then the disc swells to the corners and becomes the next section. With reduced motion the section simply takes its colour.

With Pro

The AI prompt, the React component, the plain JavaScript file and the embed come with Pro, along with the live demo. Every setting is optional: with none, you get the effect as the preview shows it.