---
title: "Genie Gallary — Free Framer component · Best of Framer"
description: "Free Framer component · by Nebiyu Daniel · Galleries. Showing all features of the genie gallary component."
canonical: "https://framer.elliotli.dev/component/genie-gallary"
---

[Home](/)/[Components](/components)/[Galleries](/components/category/galleries)/Genie Gallary

# Genie Gallary

Premium Apple Genie effect gallery

[View on Framer](https://framer.com/marketplace/components/genie-gallary/?via=elliot-li)

![Genie Gallary preview image 1](https://framer.elliotli.dev/og/component/genie-gallary/cd5e4df22a4d6992/1600x1200.jpg)

## Summary

Showing all features of the genie gallary component.

## Description

Apple Genie Effect For Framer

**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.
    

![Showing all features of the genie gallary component.](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-maepb7ne-OtIFqannRL7fUsaZBgwZIV6bvBjL5p)Showing all features of the genie gallary component.

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.
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #2990

## Details

- **Author**: Nebiyu Daniel
- **Published**: 2026-04-01
- **Updated**: 2026-04-01
- **Added**: 2026-03-22
- **Categories**: Galleries

## More like this

-   [Infinite Pan Canvas](/component/infinite-pan-canvas) — Aisol Studio · $15 — Endless image wall you can drag
-   [CMS Photo Pile](/component/cms-photo-pile) — Marso Angelov · $10 — Draggable Photo Gallery
-   [CMS Infinity Grid](/component/cms-infinity-grid) — 55N · Free — Boundless exploration.
-   [Endless CMS Reel](/component/endless-cms-reel) — Marso Angelov · $10 — Horizontal Momentum Gallery
