The Iconic macOS Animation, Rebuilt for Framer Give your users a delightful, nostalgic, and incredibly premium interaction. The Genie Gallery uses advanced WebGL mathematics to recreate the famous "vacuum funnel" effect from macOS, allowing full-screen images to gracefully squish and curve into a floating glass dock.
Features:
Zero CSS Distortion: The object-fit cover matrix prevents the image texture from squishing or stretching regardless of screen size.
Dynamic Backdrop Blur: The environmental background blur and dimming are physically tied to the 3D animation loop, staying in perfect sync frame-by-frame.
Flexible Content: Upload local image files directly or paste external URLs for dynamic content mapping.
You have total control over the component without ever looking at the code.
Dock Aesthetics: Modify the dock color, padding, gap, and icon sizes.
Expanded View: Control exactly how large the image expands in the center of the screen.
Radii Control: Set independent border radii for the small dock icons and the large expanded images.
Environment: Change the overlay tint color, maximum opacity, and background blur amount.
Animation Speed: Dial in the exact speed of the physics easing curve.
Nebiyu Daniel
