Circle Gallery FX is a highly interactive, physics-driven radial carousel designed to bring fluid, app-like motion to your Framer projects. Powered by advanced Framer Motion spring mathematics, this component ditches the standard linear slider for a sweeping circular path. As users swipe or scroll, cards smoothly rotate into focus, complete with dynamic scaling, depth-of-field blurring, and internal image parallax.

Whether you are building a high-end editorial lookbook, a photography portfolio, or a premium product showcase, this component feels incredibly tactile. It features a critical mobile-first engineering detail: smart touch-action handling ensures horizontal swiping feels buttery smooth without ever hijacking the user's vertical page scroll.

✨ Key Highlights

• Fluid Magnetic Snapping: Built with tunable spring physics (mass, stiffness, damping) that satisfyingly snaps the closest card perfectly into the center focus point when a user finishes swiping.

• Dynamic Depth-of-Field & Scale: As cards rotate away from the center, they automatically scale down, fade, and blur, creating a highly realistic 3D depth-of-field effect purely through motion values.

• Internal Media Parallax: Images and videos subtly shift inside their frames as the carousel rotates, adding a sophisticated, high-end layer of spatial depth to the interaction.

• Flawless Mobile Scrolling: Engineered with precise pan detection so users can effortlessly swipe left/right through the gallery without getting "stuck" when trying to scroll down the rest of your page.

• Elegant Typography Animations: Captions and titles feature their own staggered motion, elegantly sliding up and fading in only when their corresponding card hits the center stage.

⚙️ Complete Design Control

• Content & Media: Mix images and looping videos, configure Autoplay or Play on Hover, and fully style the typography of the dynamic center labels (size, weight, color, tracking, and gap).

• Geometry & Styling: Take total control over the circle's radius, the degree gap between each card, card dimensions, corner radiuses, custom borders, drop shadows, and the intensity of the radial background glow.

• Physics & FX: Fine-tune the drag sensitivity and mouse-wheel scroll power. Adjust the focus scale (how large the center item gets), dial the blur strength up or down, and control the exact intensity of the internal image parallax.

💡 Perfect For

• Editorial Lookbooks: Display fashion or lifestyle collections in a premium, highly tactile format.

• Photography Portfolios: Showcase high-resolution shots with a cinematic depth-of-field effect that focuses the viewer's eye.

• Feature Highlights: Present app screens, physical products, or service categories in an engaging, swipeable radial dial.