Guides
Guides.
Practical, opinionated guides on building loading animations and preloaders, written from a studio that hand-builds them. No filler, no fake progress bars.
Every guide here comes from the same place as the loaders we sell: hundreds of hand-tuned canvas loops, every one built to close without a visible seam. The guides cover the part we cannot ship in a zip, which is judgment. Where a preloader belongs and where it wears out its welcome. Why the loop boundary is the first thing we check and the last thing most loaders get right. What reduced-motion settings ask of a loader, and what a spinner actually costs in kilobytes depending on the format it ships in.
They are platform-specific on purpose. Framer and Webflow each have their own way of letting motion in (embeds, code components, page-load interactions), and a guide that hedges across both helps with neither. Pick your platform, read the method, then test the way a visitor moves.
-
framer
How to add a loading animation in Framer
Build, buy, or embed: the three ways in, the embed workflow step by step, and a live loader running on the page.
Read the guide → -
framer
How to add a custom preloader in Framer
The no-code variants method, the run-once fix most people miss, and what makes a loader feel right.
Read the guide → -
webflow
How to add a custom preloader in Webflow
A page-load interaction, the sessionStorage trick to show it once per visit, and the motion that earns its place.
Read the guide →