SpatialWave

Show Preview
SpatialWave
SpatialWave

About SpatialWave

A WebGL image carousel that bends through space.

Scroll, drag, or let it ride — slides curve along a sine wave with adjustable depth, tilt, and frequency. Hover any card and color flicks back into desaturated shots with a ripple.

Built for hero sections, portfolio reels, and editorial galleries where a flat grid won't carry the brand.

Includes:

  • Color, grayscale, and duotone modes with custom shadow/highlight

  • Grain, scanlines, chromatic aberration, pixelation, vignette

  • Wave intensity, frequency, depth curve, tilt, gap, card size

  • Scroll, drag, and wheel input

  • Transparent, color, or image background

Built right:

  • Self-contained, no runtime CDN calls

  • Static fallback for canvas, thumbnail, and export

  • IntersectionObserver pauses the render loop offscreen

  • Three.js via npm, bundled at build time

Drop in your slides and ship.

From Francisc Toth

Project Scroll
Navbar Pill
Video Bento Box
Instagram Video Card

Related Components

Curve Flow Carousel
DragSlider
Product Stage
Horizontal Scrolling