Gallery layout
Shadow Box
Pictures as cut-paper layers in a shadow box, lit by the scene so each sheet casts a real soft shadow on the one behind: inactive ones are pressed flat and grey, the active one opens into depth in full colour. Use for editorial, craft, kids and storytelling showcases.
Settings and defaults
shared
- Layout
- Row
- Aspect
- 1.4
- Sheets
- 5
- Spacing
- 1.3
- Visible
- 2.4
- Shape
- 1
- Stiffness
- 26
- Damping
- 8.5
- Smoothing
- 2.6
- Roughness
- 0.85
- Intensity
- 1
- Opacity
- 1
- Throwing
- 0.12
cursor
- Pointer mode
- Open
- Navigation
- Click
- Pointer strength
- 1
- Pointer radius
- 0.6
inactive
- Depth
- 1
- Dim
- 0.5
active
- Change time
- 1.8
- Wave
- 0.35
- Slant
- 0.3
- Separation
- 0.1
pictures
- Autoplay
- 0
Shadow Box cuts every picture into layers of paper set one behind another in a shallow box, like a hand-made diorama. The back sheet holds the whole picture and each sheet in front holds only what is brighter than its level.
How it works
The sheets are real cut paper lit by your scene, and each one casts a soft shadow onto the one behind it, so the depth reads even when nothing moves. A waiting picture's sheets are pressed together, grey and flat. When it becomes the active one, a soft wave crosses it and the sheets open into depth as they take their colour; leaving presses them together again. The shadows come from the lights of the scene, so a low, warm light makes them long and dramatic. In Open mode the cursor opens the sheets a little further.
Settings
- Sheets: how many paper sheets a picture is cut into. Few sheets far apart give long shadows, many close sheets a fine diorama.
- Separation: the distance between the sheets when open.
- Smoothing: how much the picture is softened before the sheets are cut; higher gives rounder cuts.
- Roughness: the finish of the paper.
- Change time, Wave and Slant: the speed, softness and angle of the change wave.
Use it for
Storytelling, children's books, editorial features and craft brands. The same layering in light instead of paper is Depth Layers; paper sheets that stand up on hinges are Pop-up.
Code and API
Ready-to-paste React Three Fiber code and the 3DRise API are included in paid plans, inside the studio.
More gallery layouts
Fold
Pictures printed on paper folded in one of six ways (accordion, herringbone, fan, scroll, page curl, crumple) and lit by the scene: inactive ones are folded tight and grey, the active one unfolds flat into full colour; the cursor presses a dent into it. Use for print, editorial, fashion and craft showcases.
Pop-up
Pictures as pop-up book spreads lit by the scene: cut-paper sheets hinged to a page lie folded down and grey when inactive, and stand up one after another into the picture in full colour when it becomes active. Use for storytelling, kids, editorial and craft showcases.
Depth Layers
Pictures split by brightness into thin sheets floating in depth: inactive ones are collapsed into one faint grey sheet, the active one opens into depth in full colour and its sheets slide past each other with real parallax. Use for editorial, music and dreamy showcases.
Pinscreen
Pictures as beds of fine pins lit by the scene: inactive ones are a flat grey bed, the active one is pushed out by a soft wave into a relief in full colour; the cursor presses the pins in. Use for product, tech and tactile showcases.
Slats
Pictures cut into thin vertical slats lit by the scene: inactive ones stand nearly edge-on as fine grey lines, the active one turns its slats to face you in a soft wave, closing into the picture; the cursor turns the slats near it. Use for architecture, interiors and product showcases.
Strata
Pictures as stacks of thin horizontal plates lit by the scene, each plate’s front following the picture’s brightness like a laser-cut relief: inactive ones are a flat grey stack, the active one slides forward into relief in full colour; the cursor pushes plates back. Use for architecture, product, interiors and craft showcases.
Works well with
Bounce
Hop on the spot — a real arc with a squash on every landing
Object effectBubbles
A bubble cursor: iridescent soap bubbles rise from the mouse pointer, drift and pop. For kids, playful brands, water and beauty sites.
CursorFlip
Crouch, jump and flip in the air, landing with a squash
Object effectJelly
Squash and wobble like soft rubber, keeping its volume — settles back to rest
Object effectMagic Sparkles
A magic sparkle cursor: glittering sparks shed from the mouse pointer, falling and fading behind it. For magic, festive and kids sites.
CursorPainterly Bold
Bold painterly clouds with large brush strokes and vibrant colors
Effect