Scroll Services 3D

Scroll Services 3D Section — a scroll-driven 3D cube showcase section for Framer.

Turn your services, work or process list into a rotating 3D scroll animation. Two synchronised cubes cross-rotate as the visitor scrolls: text cards roll forward while imagery counter-rotates, sharing one vanishing point for a clean seam. Drop it on the page no extra code needed.

SCROLL ANIMATION

• Scroll-driven 3D cube rotation with sticky pinning

• Cross-rotate (counter-rotation) toggle

• Spring stiffness & damping for smooth or snappy motion

• Adjustable scroll length per card to control pacing

• Progress dots indicator

• Respects reduced-motion; static canvas preview

CONTENT

• Unlimited items number, title, label/value rows, image

• Auto-numbering (01, 02, 03…) with visibility toggle

• Optional CTA face with label, image, background

• Built-in intro section: eyebrow, heading, paragraph

• Built-in bottom CTA section: heading and text

• Both sections toggle on/off use only the cube if you want

LAYOUT & STYLE

• Card size, gap, max width, corner radius, perspective

• Left or centre card text alignment

• Full colour control: background, heading, muted text, cards, accent

• Black & white image toggle

• Optional crop-mark detailing for an editorial look

• Custom font control

• Gradient fallback backgrounds when no image is set

• Responsive with clamp-based typography and spacing

GREAT FOR

Agency services sections, portfolio and case-study showcases, product feature walkthroughs, process and steps sections, studio landing pages and dark-theme hero sections.

KEYWORDS

scroll, scroll animation, 3d scroll, scroll section, sticky scroll, services section, showcase, portfolio, case study, 3d cube, gallery, cards, agency, studio, process, steps, features, CTA, parallax, editorial, responsive

NEED HELP?

Questions about installing or customizing this component or looking for custom Framer development?

Email nirav.jivani6@gmail.com. I usually reply within 24 hours.

Thank you.