Dome Gallery displays images arranged in a curved, dome-like 3D layout using depth and perspective. Users can drag horizontally and vertically to rotate the dome, with smooth inertia that continues movement after release for a natural, physics-based feel.
Each image sits on the surface of the dome and can be clicked to open in a full-screen preview mode, making it ideal for immersive galleries, showcases, and visual storytelling layouts. You can control how many images appear, the radius of the dome, drag sensitivity, rotation limits, and visual styling like grayscale and border radius.
The component is optimized for smooth interaction and works well for both mouse and touch input, making it suitable for desktop and mobile experiences.
Key Features
3D dome-style image arrangementDrag to rotate horizontally and verticallySmooth inertia after drag releaseClick to enlarge image in fullscreen viewAdjustable dome radius and rotation limitsConfigurable drag sensitivity and inertia strengthOptional grayscale filterCustom image border radiusSupports up to eight images
Use Cases
Portfolio galleriesProduct showcasesPhotography collectionsCreative landing pagesBrand storytelling sections
Best Practices / Tips
Use a larger dome radius for spacious layouts with many imagesLower drag sensitivity for smoother, cinematic rotationEnable grayscale for minimal or editorial designsKeep image count balanced to avoid visual clutter
What’s Included
One Dome Gallery componentSupport for up to eight images3D drag rotation with inertiaFullscreen image preview interactionCustom layout and motion controls
Who It’s For
Framer designers and developersCreative portfolios and agenciesProduct and brand showcase pagesNo-code builders creating immersive galleries
Dome Gallery displays images arranged in a curved, dome-like 3D layout using depth and perspective. Users can drag horizontally and vertically to rotate the dome, with smooth inertia that continues movement after release for a natural, physics-based feel.
Each image sits on the surface of the dome and can be clicked to open in a full-screen preview mode, making it ideal for immersive galleries, showcases, and visual storytelling layouts. You can control how many images appear, the radius of the dome, drag sensitivity, rotation limits, and visual styling like grayscale and border radius.
The component is optimized for smooth interaction and works well for both mouse and touch input, making it suitable for desktop and mobile experiences.
Key Features
3D dome-style image arrangementDrag to rotate horizontally and verticallySmooth inertia after drag releaseClick to enlarge image in fullscreen viewAdjustable dome radius and rotation limitsConfigurable drag sensitivity and inertia strengthOptional grayscale filterCustom image border radiusSupports up to eight images
Use Cases
Portfolio galleriesProduct showcasesPhotography collectionsCreative landing pagesBrand storytelling sections
Best Practices / Tips
Use a larger dome radius for spacious layouts with many imagesLower drag sensitivity for smoother, cinematic rotationEnable grayscale for minimal or editorial designsKeep image count balanced to avoid visual clutter
What’s Included
One Dome Gallery componentSupport for up to eight images3D drag rotation with inertiaFullscreen image preview interactionCustom layout and motion controls
Who It’s For
Framer designers and developersCreative portfolios and agenciesProduct and brand showcase pagesNo-code builders creating immersive galleries
Plaiter
