GeezerVison

The World Wide Web, restored to 800 pixels of glory.

GeezerVison is showing pro.reactbits.dev — Reel Gallery

Get Started

Site

Browse

All Components80 New

Text34

Backgrounds98

3D & Shaders49

Cursor Effects21

UI & Cards28

Reel Gallery

Tilted reels of images that glide as you scroll

reel-gallery-tw

Customize

Background

Rows

Row Height

Row Gap

Item Gap

Max Aspect

2.00

Min Aspect

0.60

Max FPS

Tilt

7.0

Arch

Speed

1.00

Speed Variance

0.55

Auto Scroll

Inertia

0.92

Damping

0.10

Drag Sensitivity

1.6

Wheel Sensitivity

1.00

Radius

Grayscale

0.55

Focus Radius

210

Focus Strength

0.85

Brightness

1.00

DPR

1.25

Fade

0.12

Dim

0.35

Taper

0.12

AlternateInteractivePaused

Props

Name	Type	Default	Description
`images`	string[]	`10 stock photos`	Image URLs spread across the reels.
`rows`	number	`6`	Number of stacked reels.
`rowHeight`	number	`92`	Height of every plate in pixels.
`rowGap`	number	`20`	Vertical space between reels in pixels.
`itemGap`	number	`16`	Horizontal space between plates in pixels.
`maxAspect`	number	`2`	Widest a plate may get, as a multiple of its height.
`minAspect`	number	`0.6`	Narrowest a plate may get, as a multiple of its height.
`maxFps`	number	`60`	Highest frame rate the reels redraw at.
`tilt`	number	`7`	Angle the whole stack leans by, in degrees.
`arch`	number	`48`	How far each reel arches across the frame, in pixels.
`speed`	number	`1`	Master multiplier on how far input travels.
`speedVariance`	number	`0.55`	How much reel speeds differ from one another, 0 to 1.
`alternate`	boolean	`false`	Send every other reel the opposite way.
`autoScroll`	number	`26`	Pixels per second the reels drift on their own.
`inertia`	number	`0.92`	How long a flick keeps gliding, 0 to 1.
`damping`	number	`0.1`	How quickly the reels catch up to input, 0 to 1.
`dragSensitivity`	number	`1.6`	How far a drag pushes the reels.
`wheelSensitivity`	number	`1`	How far a wheel notch pushes the reels.
`radius`	number	`10`	Corner radius of a plate in pixels.
`grayscale`	number	`0.55`	How desaturated plates sit at rest, 0 to 1.
`focusRadius`	number	`210`	Radius of the colour spotlight under the cursor, in pixels.
`focusStrength`	number	`0.85`	How much the spotlight restores colour and light, 0 to 1.
`brightness`	number	`1`	Overall brightness of the plates.
`dpr`	number	`1.25`	Pixel ratio ceiling.
`fade`	number	`0.12`	How far the left and right edges fade out, 0 to 0.5.
`dim`	number	`0.35`	How much the outer reels dim, 0 to 1.
`taper`	number	`0.12`	How much the outer reels shrink, 0 to 1.
`backgroundColor`	string	`"transparent"`	Backdrop colour behind the reels.
`interactive`	boolean	`true`	Let the wheel, drag and arrow keys drive the reels.
`paused`	boolean	`false`	Freeze the drift.
`className`	string	`-`	Extra classes for the wrapper.
`children`	ReactNode	`-`	Content layered above the reels.

imagesstring[]

Image URLs spread across the reels.

Default10 stock photos

rowsnumber

Number of stacked reels.

Default6

rowHeightnumber

Height of every plate in pixels.

Default92

rowGapnumber

Vertical space between reels in pixels.

Default20

itemGapnumber

Horizontal space between plates in pixels.

Default16

maxAspectnumber

Widest a plate may get, as a multiple of its height.

Default2

minAspectnumber

Narrowest a plate may get, as a multiple of its height.

Default0.6

maxFpsnumber

Highest frame rate the reels redraw at.

Default60

tiltnumber

Angle the whole stack leans by, in degrees.

Default7

archnumber

How far each reel arches across the frame, in pixels.

Default48

speednumber

Master multiplier on how far input travels.

Default1

speedVariancenumber

How much reel speeds differ from one another, 0 to 1.

Default0.55

alternateboolean

Send every other reel the opposite way.

Defaultfalse

autoScrollnumber

Pixels per second the reels drift on their own.

Default26

inertianumber

How long a flick keeps gliding, 0 to 1.

Default0.92

dampingnumber

How quickly the reels catch up to input, 0 to 1.

Default0.1

dragSensitivitynumber

How far a drag pushes the reels.

Default1.6

wheelSensitivitynumber

How far a wheel notch pushes the reels.

Default1

radiusnumber

Corner radius of a plate in pixels.

Default10

grayscalenumber

How desaturated plates sit at rest, 0 to 1.

Default0.55

focusRadiusnumber

Radius of the colour spotlight under the cursor, in pixels.

Default210

focusStrengthnumber

How much the spotlight restores colour and light, 0 to 1.

Default0.85

brightnessnumber

Overall brightness of the plates.

Default1

dprnumber

Pixel ratio ceiling.

Default1.25

fadenumber

How far the left and right edges fade out, 0 to 0.5.

Default0.12

dimnumber

How much the outer reels dim, 0 to 1.

Default0.35

tapernumber

How much the outer reels shrink, 0 to 1.

Default0.12

backgroundColorstring

Backdrop colour behind the reels.

Default"transparent"

interactiveboolean

Let the wheel, drag and arrow keys drive the reels.

Defaulttrue

pausedboolean

Freeze the drift.

Defaultfalse

classNamestring

Extra classes for the wrapper.

Default-

childrenReactNode

Content layered above the reels.

Default-

You are visitor 01402520 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.