Animation

Control animation speed, image reveal effects, and page transitions to match your store's pace — from instant and minimal to smooth and editorial.

Theme Editor → Theme settings → Animation

Motion that builds brand perception

Animations are one of the subtlest signals of quality in an online store. A well-timed fade-in, a smooth cart drawer opening, an underline that appears with purpose — these micro-interactions collectively tell customers they're shopping somewhere that cares about design.

---

Animation duration — set the tempo

This is the global tempo dial. Every animation in the theme — drawers, buttons, image reveals — respects this setting.

• Basic — fast, efficient. Keeps customers moving. Best for high-SKU stores and fast-paced shopping experiences.
• Smooth — slower, more considered. Suits luxury, editorial, and beauty brands where pace communicates care.

Enable drawer animations — adds open/close transitions to drawers (cart, menu, etc.)

Enable anchor links smooth scroll — controls smooth scrolling when clicking anchor links

---

Image reveal — how products arrive on screen

Lazy loading controls the impression each image makes as it enters the viewport. This is about perception, not just performance.

• Pixelate / Blur-up — low-res placeholder sharpens into the full image. Feels polished and intentional.
• Fade-in, scale-out — image fades in and subtly scales up. The most expressive option; gives a cinematic quality to product grids.

---

Page fade-in & button zoom

Fade-in animation on load creates a smooth entrance for page content.

Set the Fade-in area to Main content (not Entire page) for the best result: the header loads instantly while the hero fades in — a subtle effect that reads as deliberate and premium.

Enable zoom on buttons adds a micro-interaction on hover — a small touch that makes the storefront feel more responsive.

---

Preload links on hover

When a customer moves their cursor toward a link, Avante begins loading the next page in the background. By the time they click, the page is already partly loaded — navigation feels instant even on average connections. High-impact, zero cost.

Disable Preload links on hover while working in the Theme Editor — it can cause the editor to lag. Re-enable it before publishing.

Pro tip: Enable animated underline and Enable rolling hover for menu items add micro-interactions to navigation links at no performance cost. Together they make the header feel noticeably more premium — especially on desktop.