Trending Society

Scroll Mask | UI components | Trending Society

More from @mewo, 39 components

All @mewo

Album Rail component
@mewo
A fanned rail of album sleeves that turn away in 3D, with a record that slides out and spins on play, a tick ruler, swipe, wheel and arrow keys. No dependencies.
Layout
Chapter Nav component
@mewo
Chapter navigation for a long scroll story: a glass rail of dots at the inline end, the current chapter's dot stretched and filling as you read, that opens a panel listing the chapters with a progress bar under each. Controlled or on its own. No dependencies.
Motion and effects
Concave Carousel component
@mewo
A gallery wall that curves around the viewer in CSS 3D, with a slow drift, spring snapping, drag and flick, the wheel, captions and a floor reflection. No dependencies.
Layout
Corner Hint component
@mewo
A glass hint in the bottom corner that grows in as it fades in, with a message that can replace it for a moment; announced politely to screen readers. No dependencies.
Text
Corner Wordmark component
@mewo
The name in the top corner, linking back to the start: it fades in once the reader scrolls away, difference-blended over the pictures. No dependencies.
Text
Date Timeline component
@mewo
A short line with a gap that slides to the current date, and the dates; a scroll stage moves it through its tracks. No dependencies.
Motion and effects1 registry dep
Depth Card component
@mewo
A card that tilts toward the pointer in 3D while its image layers shift in depth under a soft spotlight, and its text rises in on hover. No dependencies.
Layout
Depth Image component
@mewo
A photo relit by a light that follows the pointer or drifts on a slow orbit, with depth, surface detail and soft self-shadows estimated from the image. Raw WebGL 2, no dependencies.
Backgrounds
Dot Grid component
@mewo
A grid of dots on springs: they scatter from the pointer, ripple out from a click and settle back. Raw WebGL 2, no dependencies.
Backgrounds
Dream Cat component
@mewo
The mewo cat in a dream, its outline fraying into a slowly drifting fog: its round hand reaches for the pointer wherever it is, the arm stretching as far as it must, and stirs the fog as it goes; its eyes follow and its body leans in. Drawn with WebGL 2 on ogl; the drift can be stopped, and then it is idle while the pointer rests.
Backgrounds1 package
Glass Panel component
@mewo
A glass panel that grows out of the button that opens it, its content dropping into place in turn. Parts like shadcn's dialog (GlassPanel, GlassPanelTrigger, GlassPanelContent, GlassPanelTitle, GlassPanelFooter, GlassPanelClose) on a non-modal Base UI dialog: Escape and a press outside close it, focus moves in and back.
Layout1 package
Gradient Carousel component
@mewo
A looping 3D card carousel you turn by wheel, drag or arrow keys, over a blurred gradient drawn in the colours of the centre image. No dependencies.
Layout

Scroll Mask

Install

Live preview

Registry dependencies0

Packages0

Scroll Mask

Install

Live preview

Registry dependencies0

Packages0

Source

More from @mewo, 39 components

The Signal

Install

Live preview

Registry dependencies0

Packages0

Install

Live preview

Registry dependencies0

Packages0

Source

More from @mewo39, 39 components

More from @mewo, 39 components