Skip to content

component

Vela Loader

By Jane

Details

Summary

A cinematic page loader

Description

How it works Two waves of tilted photo cards animate into view around your logo. The first wave of four cards rises from below and settles into a scattered arrangement. Your logo fades in between the two waves and holds centre stage. A second wave of three cards slides in from the sides, layering over the first. Then everything dissolves, the entire scene fades to nothing, and your page content takes over. The exit is what makes Vela distinct. No scatter, no wipe, just a long, smooth fade that feels like a cinema curtain rising. Clean and confident. What's included 7 image slots across two waves (Wave 1 × 4, Wave 2 × 3) Logo image with width control and blend mode (Normal / Difference / Overlay) Adaptive sequencing- desktop full sequence, tablet and mobile shortened automatically Preview Device dropdown- match your active canvas breakpoint Skip Intro button with colour, size, and text controls Per-device duration controls (Desktop / Tablet / Mobile) Background colour control No dependencies beyond Framer's built-in Motion library Position settings in Framer Position: Absolute Left: 0, Top: 0, right: 0, bottom: 0 Width: 100% Height: 100vh Pin: left + right + top (no bottom pin needed) Style: Add Pointer - None

Introduction

A cinematic page loader

Rank history

Daily rank per list, from the first snapshot — lower is better.

120014001600168248/148/228/309/79/15
  • All · #6776