Lumina 3D Gallery

Zenora UI

Get Started

Lumina 3D Gallery·Gallery

npx zenora-ui-registry@latest add lumina-gallery

Gallery

210 views•95 uses

Get this component

Copies the component into your project, installs what it needs, and pulls down its images. Nothing to download by hand.

npx zenora-ui-registry@latest add lumina-gallery

Writes to components/zenora-ui/ by default; override with --dir. The file is yours to edit; there is no package to keep in sync.

Or let an AI agent pull it in for you. Set up the MCP server

A mesmerizing 3D circular carousel gallery that responds to your cursor. Perfect for showcasing photography, art, or product collections with an immersive, high-end museum feel.

KEY FEATURES

·Cards dynamically adjust depth and size based on cursor proximity, creating an immersive 3D effect
·Features a buttery-smooth physics engine with lerping for perfectly fluid movement
·Seamlessly loops around when you drag or hover past the edges
·Interactive title reveals and elegant footer typography for a premium layout

Props

10 properties

imagesstring[]10 images

List of images for the gallery.

imageCountnumber25

Number of slots in the carousel (images will repeat).

radiusnumber275

The radius of the 3D circular path.

sensitivitynumber500

How fast the carousel rotates when interacting.

effectFalloffnumber250

Distance before the cursor's depth effect diminishes.

cardMoveAmountnumber50

How far cards are pushed on the Z-axis by the cursor.

lerpFactornumber0.15

Interpolation factor for smooth physics.

brandNamestringLUMINA ARCHIVE

Main logo or brand text.

subtitlestringCollection • Over…

Secondary text under the brand.

Bottom left footer text.

Zenora UI

Get Started

Lumina 3D Gallery·Gallery

Swipe to rotate • Tap to explore

npx zenora-ui-registry@latest add lumina-gallery