Animated Sections

Animated Sections is a fullscreen storytelling component that blends rich imagery, smooth transitions, and minimalist typography to create cinematic on-scroll or autoplay slideshows.

Each section fills the viewport with a bold background image and elegant headline, letting you showcase brand stories, campaigns, or case studies in a visually immersive way.

Whether you use it for portfolio hero storytelling, product showcases, or editorial experiences, Animated Sections brings motion and mood to your Framer page with effortless setup.

✨ Features

• Cinematic fullscreen design — Each section fills the viewport with depth and smooth fading transitions.

• Scroll or swipe navigation — Intuitive mouse wheel and touch support for effortless flow between slides.

• Autoplay support — Hands-free storytelling with adjustable duration.

• Custom thumbnails & section counter — See all slides and jump instantly to any section.

• Responsive & adaptive — Works across all screen sizes with dynamic text scaling.

• Font customization — Easily adjust typography using Framer’s font control.

💡 Perfect for

• Portfolio intros or creative storytelling

• Photography and film showcases

• Brand campaigns and hero sliders

• Case study and editorial features

🎨 How to Use

1. Drag the Animated Sections component onto your Framer canvas.

2. Open the Sections control and add your slides — each with a title and background image.

3. Toggle Autoplay on if you want the slides to advance automatically.

4. Adjust Autoplay Duration for timing between slides.

5. Customize the Heading Font to match your brand style.