Drop your photos in and watch them cascade!
Your images wrap around 3D spheres that pour down and pile up as soon as they enter the viewport. Hover over the pile to scatter and play with them. A perfect, physics-driven way to captivate your visitors and add tactile depth to your layouts.
• Photos: Wraps your images seamlessly around each sphere like a globe. Upload up to 5 images to distribute them sequentially. A 2:1 ratio (e.g., 1024×512) fits perfectly. Keep key subjects in the center band, as the poles pinch the image. Leave blank for default pastel gradients.
• Ball Size: Controls the diameter proportionally to the frame height, automatically scaling down for mobile screens. The overall pile volume stays consistent—go large for a few heavy hitters, or small for a massive, detailed pile. The total sphere count auto-adjusts based on frame width.
• Drop: Dial in the physical weight. Choose 'Floaty' for a bouncy, balloon-like landing, or 'Heavy' for a solid, immediate thud (Default: Normal).
• Dynamic Footers: Place it at the bottom of your page. As visitors scroll down, a cascade of brand imagery piles up, leaving a tactile and memorable impression right before they leave.
• Interactive Heroes: Swap static image grids for a playground of real-time physics. Let your logos and product shots tumble and roll, reacting instantly when the cursor brushes past.
To install the component, please copy and paste the component URL below directly onto your Framer canvas.
Please note that the animations only work in Preview mode. The component may appear paused or as an empty screen on the Framer canvas.
Drop your photos in and watch them cascade!
Your images wrap around 3D spheres that pour down and pile up as soon as they enter the viewport. Hover over the pile to scatter and play with them. A perfect, physics-driven way to captivate your visitors and add tactile depth to your layouts.
• Photos: Wraps your images seamlessly around each sphere like a globe. Upload up to 5 images to distribute them sequentially. A 2:1 ratio (e.g., 1024×512) fits perfectly. Keep key subjects in the center band, as the poles pinch the image. Leave blank for default pastel gradients.
• Ball Size: Controls the diameter proportionally to the frame height, automatically scaling down for mobile screens. The overall pile volume stays consistent—go large for a few heavy hitters, or small for a massive, detailed pile. The total sphere count auto-adjusts based on frame width.
• Drop: Dial in the physical weight. Choose 'Floaty' for a bouncy, balloon-like landing, or 'Heavy' for a solid, immediate thud (Default: Normal).
• Dynamic Footers: Place it at the bottom of your page. As visitors scroll down, a cascade of brand imagery piles up, leaving a tactile and memorable impression right before they leave.
• Interactive Heroes: Swap static image grids for a playground of real-time physics. Let your logos and product shots tumble and roll, reacting instantly when the cursor brushes past.
To install the component, please copy and paste the component URL below directly onto your Framer canvas.
Please note that the animations only work in Preview mode. The component may appear paused or as an empty screen on the Framer canvas.
mx.bear
