⚠️ Mobile is not supported yet.
Search for a command to run...
A WebGL and Motion system for React that runs many effects on one shared canvas. Shader, cursor, scroll and text effects, 3D galleries, plus page transitions for Next.js. Built with Three.js, React Three Fiber, Motion, and Lenis smooth scroll.
Wiring rules an AI agent reads before using Atelier components.
A page transition that sweeps staggered bands across the page.
The Atelier system: one shared canvas, smooth scroll, and the agent rules.
A page transition that clips and scales the page behind a cover.
An image or video that bends as you scroll.
A trail of dithered dots that follows the cursor and bends the scene behind it.
A wrapper that bounces away from the cursor on hover.
Items that bounce and stick to the center while scrolling.
Text that falls and bounces when the cursor moves over it.
A fluid distortion effect that follows the cursor.
A glowing fog background.
An animated flowing gradient background.
A glowing halftone background.
Images or items that burst around the cursor when it enters an element.
Images that pop up along the cursor's path and fade out behind it.
A trail of images that follows the cursor.
A gallery that loops forever.
Infinite scrolling columns with parallax.
An infinite zoom through images.
An image or video with a cursor-following lens.
Letters that come together into readable text as you scroll, then scatter again.
An image or video that ripples under the cursor.
A grid of dots that reacts to the cursor.
Images that traverse the screen, magnifying and rising to the top of the stack as they pass the center.
A gallery of images on rotating rings.
A route transition engine that covers the page during navigation.
Text that pixelates in and out.
An image or video that breaks into pixels under the cursor.
A grid of pixels that fills in as you scroll.
A trail of pixels that follows the cursor.
A page transition that pixelates the screen with a fixed grid of squares.
A grid that scatters away from the hovered item.
Items that spread apart while scrolling.
Smooth scrolling for the whole page.
A gallery of images mapped onto a sphere.
An infinite carousel of images staggered along a spiraling tube that scrolls indefinitely.
A configurable grid of cards that stacks to the center while scrolling.
A page transition that wipes a staggered grid of stripes across the page.
Flat images scattered over a draggable sphere, where depth is only a change of scale.
Text that bounces away on hover.
Text with an animated shimmer and distortion.
Text that rolls through its letters.
Text that scrambles into place.
A utility that splits text for animation.
Text and images that wave across the screen while scrolling.
A WebGL plane that mirrors an image.
A shared portal between the DOM and the canvas.
A single shared WebGL canvas for the whole app.