Realistic Fall
A 3D falling effect with images. It simulates depth and perspective by varying the sway, size, blur, and movement of multiple instances of an image
Make it with Workshop
Build your own component with AI
A 3D falling effect with images. It simulates depth and perspective by varying the sway, size, blur, and movement of multiple instances of an image
Make it with Workshop
Build your own component with AI
This component creates a 3D falling effect with images. It simulates depth and perspective by varying the sway, size, blur, and movement of multiple instances of an image falling from top to bottom, with an optional centered object in the middle of the animation.
This component a part of the 400+ components, layouts, templates, UI Kits and code overrides from SegmentUI PRO. Click here to see the full library
Copy and paste the component into your project file
Upload your desired image through the Image control
Customize the animation properties:
Count: Set number of falling elements
Max Size: Adjust the largest size of elements
Max Blur: Control the maximum blur effect
Size Reduction: Adjust size difference between front and back elements
Sway Amount: Control horizontal movement
Speed: Adjust falling speed
Optionally, add a mid object component that will stay centered in the animation
The 3D effect combines size variation (larger in front, smaller in back), motion parallax (closer objects move faster), blur effects for depth, and randomized sway patterns. These elements work together to create a natural, layered falling motion that simulates real depth perception.
For any queries and help setting up the component, contact hello@segmentui.com
